mirror of
https://github.com/taigrr/wails.git
synced 2026-04-02 05:08:54 -07:00
[v2] Docs update
This commit is contained in:
Lea Anthony
@@ -0,0 +1,54 @@
|
||||
---
|
||||
title: 关于 sidebar_position: 1
|
||||
---
|
||||
|
||||
# 关于
|
||||
|
||||
## 概述
|
||||
|
||||
Wails 是一个可让你使用 Go 和 Web 技术编写桌面应用的项目。
|
||||
|
||||
将它看作为轻量快速的 “Electron for Go”。 你可以结合了丰富、现代的前端技术轻松地构建具有灵活性和强大功能的 Go 应用程序。
|
||||
|
||||
Wails 一点也不弱！这是 [xbar](https://xbarapp.com) - 一个使用 Wails 编写的 MacOS 桌面应用。它使用 Mac 的系统原生菜单，支持浅色和深色桌面主题，主窗口使用半透明，使其具有原生应用的
|
||||
“冰霜” 效果。
|
||||
|
||||
<div class="text--center">
|
||||
<a href="https://xbarapp.com"><img src="/img/xbar-app-preview-2.png"/></a>
|
||||
</div>
|
||||
|
||||
## 原生元素
|
||||
|
||||
Wails 使用专门的库来处理原生元素，例如窗口、菜单、对话框等，因此你可以构建美观、功能丰富的桌面应用程序。 它不嵌入浏览器，因此性能高。相反，它使用平台的原生渲染引擎。在 Windows 上，是基于 Chromium 构建的新
|
||||
Microsoft Webview2 库。
|
||||
|
||||
## Go 和 Javascript 互操作
|
||||
|
||||
Wails 自动使你的 Go 方法可用于 Javascript，因此你可以从前端按名称调用它们！它甚至会生成 Go 方法使用的结构的 Typescript 版本，因此你可以在 Go 和 Javascript 之间传递相同的数据结构。
|
||||
|
||||
## 运行时库
|
||||
|
||||
Wails 为 Go 和 Javascript 提供了一个运行时库，可以处理现代应用程序需要的很多东西，比如事件、日志记录、对话框等。
|
||||
|
||||
## 实时开发体验
|
||||
|
||||
### 自动重新构建
|
||||
|
||||
当你在“dev”模式下运行你的应用程序时，Wails 会将你的应用程序构建为原生桌面应用程序，但会从磁盘读取你的资源。它将检测你的 Go 代码的任何更改，并自动重新构建和重新启动你的应用程序。
|
||||
|
||||
### 自动重新加载
|
||||
|
||||
当检测到你的应用程序资源发生更改时，你正在运行的应用程序将“重新加载”，几乎立即反馈你的更改。
|
||||
|
||||
### 在浏览器中开发你的应用程序
|
||||
|
||||
如果你更喜欢在浏览器中调试和开发，那么我们可以满足你的需求。正在运行的应用程序还有一个网络服务器，它将在连接到它的任何浏览器中运行你的应用程序。当你的资源在磁盘上发生变化时，它会刷新。
|
||||
|
||||
## 生成原生二进制文件
|
||||
|
||||
当你准备好完成应用程序的最终构建时，CLI 会将其编译为单个可执行文件，并将所有资源打包到其中。在 Windows 和 MacOS
|
||||
上，可以创建用于分发的原生包。使用打包器后生成的资源（图标、info.plist、清单文件等）是你项目的一部分，可以自定义，让你完全控制应用程序的构建方式。
|
||||
|
||||
## 工具
|
||||
|
||||
Wails CLI 提供了一种简单的方法来生成、构建和打包你的应用程序。可以从许多入门模板中进行选择，以快速启动和运行！
|
||||
@@ -0,0 +1,21 @@
|
||||
---
|
||||
sidebar_position: 50
|
||||
---
|
||||
|
||||
# 社区模板
|
||||
|
||||
此页面用作社区支持的模板列表。请提交一个包含您的模板的 PR（点击页面底部的`编辑此页`）。要构建您自己的模板，请参考[模板](/docs/guides/templates)指南。
|
||||
|
||||
要使用这些模板，请运行 `wails init -n "你的项目名" -t [下面的链接]`
|
||||
|
||||
示例：`wails init -n "Your Project Name" -t https://github.com/misitebao/wails-template-vue`
|
||||
|
||||
:::warning 注意
|
||||
|
||||
仅安装你信任的远程模板。 如果你不确定某个模板，请检查 `package.json` 中运行的脚本和安装的模块。 **Wails 项目对第 3 方模板不承担任何责任！**
|
||||
|
||||
:::
|
||||
|
||||
## Vue
|
||||
|
||||
- [wails-template-vue](https://github.com/misitebao/wails-template-vue) - 基于 Vue 和 Vue-Router 的 Wails 模板
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Community",
|
||||
"position": 5
|
||||
}
|
||||
@@ -0,0 +1,19 @@
|
||||
---
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# 链接
|
||||
|
||||
此页面用于列出社区相关的链接。请提交 PR（点击页面底部的`编辑此页`）增加链接。
|
||||
|
||||
## 支持的通道
|
||||
|
||||
- [Gophers Slack Channel](https://gophers.slack.com/messages/CJ4P9F7MZ/)
|
||||
- [Gophers Slack Channel Invite](https://invite.slack.golangbridge.org/)
|
||||
- [Github Issues](https://github.com/wailsapp/wails/issues)
|
||||
- [v2 Beta Discussion Board](https://github.com/wailsapp/wails/discussions)
|
||||
|
||||
## 社交媒体
|
||||
|
||||
- [Twitter](https://twitter.com/wailsapp)
|
||||
- [Wails 中文社区 QQ 群](https://qm.qq.com/cgi-bin/qm/qr?k=PmIURne5hFGNd7QWzW5qd6FV-INEjNJv&jump_from=webapi) - 群号：1067173054
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Showcase",
|
||||
"position": 1
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
---
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# 模板
|
||||
|
||||
此页面用作社区支持的模板列表。请提交一个包含您的模板的 PR（点击页面底部的`编辑此页`）。要构建您自己的模板，请参考[模板](/docs/guides/templates)指南。
|
||||
|
||||
要使用这些模板，请运行 `wails init -n "你的项目名" -t [下面的链接]`
|
||||
|
||||
示例：`wails init -n "Your Project Name" -t https://github.com/misitebao/wails-template-vue`
|
||||
|
||||
:::warning 注意
|
||||
|
||||
**Wails 项目不维护也不对第 3 方模板负责**
|
||||
|
||||
如果你不确定某个模板，请检查 `package.json` 中运行的脚本和安装的模块。
|
||||
|
||||
:::
|
||||
|
||||
## Vue
|
||||
|
||||
- [wails-template-vue](https://github.com/misitebao/wails-template-vue) - 基于 Vue 和 Vue-Router 的 Wails 模板
|
||||
@@ -0,0 +1,83 @@
|
||||
---
|
||||
sidebar_position: 99
|
||||
---
|
||||
|
||||
# 荣誉墙
|
||||
|
||||
- [Lea Anthony](https://github.com/leaanthony) - 项目所有者，首席开发人员
|
||||
- [Misitebao](https://github.com/misitebao) - 中文文档，Windows 测试，寻找漏洞
|
||||
- [Travis McLane](https://github.com/tmclane) - 处理交叉编译相关工作, MacOS 平台的测试
|
||||
- [Byron Chris](https://github.com/bh90210) - Linux 发行版指导，Linux 平台的测试
|
||||
|
||||
## 赞助商
|
||||
|
||||
<div
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: `
|
||||
<a href="https://github.com/sponsors/leaanthony" style="width:100px;">
|
||||
<img src="/img/bronze%20sponsor.png" width="100"/>
|
||||
</a>
|
||||
<a href="https://github.com/snider" style="width:100px;">
|
||||
<img src="https://github.com/snider.png?size=100" width="100"/>
|
||||
</a>
|
||||
<br/>
|
||||
<br/>
|
||||
<a href="https://github.com/matryer" style="width:100px">
|
||||
<img src="https://github.com/matryer.png" width="100"/>
|
||||
</a>
|
||||
<a href="https://www.jetbrains.com?from=Wails" style="width:100px">
|
||||
<img src="/img/jetbrains-grayscale.png" width="100"/>
|
||||
</a>
|
||||
<a href="https://github.com/tc-hib" style="width:55px">
|
||||
<img src="https://github.com/tc-hib.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/picatz" style="width:50px">
|
||||
<img src="https://github.com/picatz.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/tylertravisty" style="width:50px">
|
||||
<img src="https://github.com/tylertravisty.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/akhudek" style="width:50px">
|
||||
<img src="https://github.com/akhudek.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/trea" style="width:50px">
|
||||
<img src="https://github.com/trea.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/LanguageAgnostic" style="width:55px">
|
||||
<img src="https://github.com/LanguageAgnostic.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/fcjr" style="width:55px">
|
||||
<img src="https://github.com/fcjr.png?size=55" width="55"/>
|
||||
</a>
|
||||
<a href="https://github.com/nickarellano" style="width:60px">
|
||||
<img src="https://github.com/nickarellano.png?size=60" width="60"/>
|
||||
</a>
|
||||
<a href="https://github.com/bglw" style="width:65px">
|
||||
<img src="https://github.com/bglw.png?size=65" width="65"/>
|
||||
</a>
|
||||
<a href="https://github.com/jugglingjsons" style="width:50px">
|
||||
<img src="https://github.com/jugglingjsons.png?size=50" width="50"/>
|
||||
</a>
|
||||
<a href="https://github.com/marcus-crane" style="width:50px">
|
||||
<img src="https://github.com/marcus-crane.png?size=50" width="50"/>
|
||||
</a>
|
||||
`,
|
||||
}}
|
||||
/>
|
||||
|
||||
## 贡献者
|
||||
|
||||
import Contributors from "react-contributors";
|
||||
|
||||
<Contributors owner="wailsapp" repo="wails" />
|
||||
|
||||
## 特别提及
|
||||
|
||||
- [John Chadwick](https://github.com/jchv) - 他在 [go-webview2](https://github.com/jchv/go-webview2) 和
|
||||
[go-winloader](https://github.com/jchv/go-winloader) 方面的出色工作使 Windows 版本成为可能。
|
||||
- [Tad Vizbaras](https://github.com/tadvi) - 他的 winc 项目是走向纯粹的 Go Wails 的第一步。
|
||||
- [Mat Ryer](https://github.com/matryer) - 寻求建议和支持。
|
||||
- [Dustin Krysak](https://wiki.ubuntu.com/bashfulrobot) - 提供了巨大的的支持和反馈。
|
||||
- [Justen Walker](https://github.com/justenwalker/) - 帮助解决 v2 上线要解决的问题。
|
||||
- [Wang, Chi](https://github.com/patr0nus/) - DeskGap 项目对 Wails v2 的方向产生了巨大影响。
|
||||
- [Serge Zaitsev](https://github.com/zserge) - 虽然 Wails 没有使用 Webview 项目，但它仍然是一个灵感来源。
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Getting Started",
|
||||
"position": 2
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
---
|
||||
title: 编译你的项目
|
||||
sidebar_position: 6
|
||||
---
|
||||
|
||||
# 编译你的项目
|
||||
|
||||
从项目目录，运行`wails build`。 这将编译你的项目并将构建的二进制文件保存在 `build/bin` 目录中。
|
||||
|
||||
如果你运行二进制文件，你应该会看到默认应用程序：
|
||||
|
||||
待定
|
||||
|
||||
有关编译选项的更多详细信息，请参阅[构建命令](/docs/reference/cli#构建)。
|
||||
@@ -0,0 +1,16 @@
|
||||
---
|
||||
title: 开发你的应用程序
|
||||
sidebar_position: 5
|
||||
---
|
||||
|
||||
# 开发你的应用程序
|
||||
|
||||
你可以通过运行`wails dev`从项目目录在开发模式下运行你的应用程序。这将执行以下操作：
|
||||
|
||||
- 构建你的应用程序并运行它
|
||||
- 监听 Go 文件中的修改并在更改时重新构建/重新运行
|
||||
- 设置将通过浏览器为你的应用程序提供服务的[网络服务器](http://localhost:34115)。这允许你使用你喜欢的浏览器扩展。你甚至可以从控制台调用 Go 代码。
|
||||
|
||||
首先，在项目目录中运行`wails dev`。可以在[此处](/docs/reference/cli#开发)找到有关这方面的更多信息。
|
||||
|
||||
即将提供：教程
|
||||
@@ -0,0 +1,45 @@
|
||||
---
|
||||
title: 创建项目
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# 创建项目
|
||||
|
||||
## 项目生成
|
||||
|
||||
现在 CLI 已安装，你可以使用该`wails init`命令生成一个新项目。
|
||||
|
||||
为了快速启动和运行，你可以通过运行`wails init -n myproject`生成一个默认项目。这将创建一个名为`myproject`的目录，并使用默认模板填充它。
|
||||
|
||||
其他项目模板也可用，可以使用 `wails init -l`列出。
|
||||
|
||||
要查看其他可用选项，你可以运行 `wails init -help`。 更多详细信息可以在 [初始化命令](/docs/reference/cli#初始化)中找到。
|
||||
|
||||
## 项目布局
|
||||
|
||||
Wails 项目具有以下布局：
|
||||
|
||||
```
|
||||
.
|
||||
├── build/
|
||||
│ ├── appicon.png
|
||||
│ ├── darwin/
|
||||
│ └── windows/
|
||||
├── frontend/
|
||||
├── main.go
|
||||
└── wails.json
|
||||
```
|
||||
|
||||
### 项目结构概要
|
||||
|
||||
- `/main.go` - 主应用
|
||||
- `/frontend/` - 前端项目文件
|
||||
- `/build/` - 项目构建目录
|
||||
- `/build/appicon.png` - 应用程序图标
|
||||
- `/build/darwin/` - Mac 特定的项目文件
|
||||
- `/build/windows/` - Windows 特定的项目文件
|
||||
- `/wails.json` - 项目配置
|
||||
|
||||
`frontend`目录没有特定于 Wails 的内容，可以是您选择的任何前端项目。
|
||||
|
||||
`build`目录在构建过程中使用。这些文件可以更新以自定义您的构建。如果文件从构建目录中删除，将重新生成默认版本。
|
||||
@@ -0,0 +1,71 @@
|
||||
---
|
||||
title: 安装
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# 安装
|
||||
|
||||
## 支持的平台
|
||||
|
||||
- Windows 10
|
||||
- MacOS x64 & arm64 (due October '21)
|
||||
- Linux (due December '21)
|
||||
|
||||
## 依赖
|
||||
|
||||
Wails 有许多安装前需要的常见依赖项：
|
||||
|
||||
- Go 1.16+
|
||||
- npm LTS
|
||||
|
||||
### Go
|
||||
|
||||
从 [Go 下载页面](https://golang.org/dl/) 下载 Go。
|
||||
|
||||
确保你遵守官方的 [Go 安装说明](https://golang.org/doc/install#install)。你还需要确保你的 `PATH` 环境变量包含你的 `~/go/bin` 目录路径。 重启终端并执行以下命令检查：
|
||||
|
||||
- 检查 Go 是否安装正确： `go version`
|
||||
- 检查 "~/go/bin" 是否在你的 PATH 变量中： `echo $PATH | grep go/bin`
|
||||
|
||||
### npm
|
||||
|
||||
从 [Node 下载页面](https://nodejs.org/en/download/) 下载 Npm。最好使用最新版本，因为这是我们通常会测试的版本。
|
||||
|
||||
运行 `npm --version` 进行校验。
|
||||
|
||||
## 平台指定依赖关系
|
||||
|
||||
你还需要安装指定平台的依赖项：
|
||||
|
||||
import Tabs from "@theme/Tabs";
|
||||
import TabItem from "@theme/TabItem";
|
||||
|
||||
<Tabs
|
||||
defaultValue="Windows"
|
||||
values={[
|
||||
{ label: "Windows", value: "Windows" },
|
||||
{ label: "MacOS", value: "MacOS" },
|
||||
{ label: "Linux", value: "Linux" },
|
||||
]}
|
||||
>
|
||||
<TabItem value="Windows">
|
||||
Wails 要求安装
|
||||
<a href="https://developer.microsoft.com/zh-cn/microsoft-edge/webview2/">WebView2</a>
|
||||
运行时。一些 Windows 已经默认安装了这个。你可以使用 <code>wails doctor</code>
|
||||
命令进行检查（见下文）。
|
||||
</TabItem>
|
||||
<TabItem value="MacOS">即将推出...</TabItem>
|
||||
<TabItem value="Linux">即将推出...</TabItem>
|
||||
</Tabs>
|
||||
|
||||
## 可选依赖
|
||||
|
||||
- [UPX](https://upx.github.io/) 用于压缩你的应用程序。
|
||||
|
||||
## 安装 Wails
|
||||
|
||||
运行 `go get github.com/wailsapp/wails/v2/cmd/wails` 安装 Wails CLI。
|
||||
|
||||
## 系统检查
|
||||
|
||||
运行 `wails doctor` 将检查你是否安装了正确的依赖项。如果没有，它会就缺少的内容提供建议并帮助纠正任何问题。
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Guides",
|
||||
"position": 4
|
||||
}
|
||||
@@ -0,0 +1,152 @@
|
||||
---
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# 应用开发
|
||||
|
||||
使用 Wails 开发应用程序没有硬性规定，但有一些基本准则。
|
||||
|
||||
## 应用程序设置
|
||||
|
||||
默认模板使用 `main.go` 配置和运行应用程序, 同时`app.go`用于定义应用程序逻辑.
|
||||
|
||||
该`app.go`文件将定义一个结构体，该结构体有 2 个方法作为主应用程序的回调：
|
||||
|
||||
```go title="app.go"
|
||||
type App struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
func NewApp() *App {
|
||||
return &App{}
|
||||
}
|
||||
|
||||
func (a *App) startup(ctx context.Context) {
|
||||
a.ctx = ctx
|
||||
}
|
||||
|
||||
func (a *App) shutdown(ctx context.Context) {
|
||||
}
|
||||
```
|
||||
|
||||
- `startup`方法会在 Wails 分配它需要的资源后立即调用，这是创建资源、设置事件侦听器以及应用程序在启动时需要的任何其他内容的好地方。它提供了一个`context.Context`，
|
||||
通常保存在结构字段中。调用[运行时](/docs/reference/runtime/intro)需要此`context.Context`。如果此方法返回错误，则应用程序将终止。在开发模式下，错误会输出到控制台。
|
||||
- `shutdown`方法会在应用程序关闭进程时调用，这是释放内存和执行任何关闭任务的好地方。
|
||||
|
||||
`main.go`文件通常由对`wails.Run()`的单个调用组成，它接受应用程序配置。模板使用的模式是，在调用`wails.Run()`之前，
|
||||
我们创建并保存一个在`app.go`中定义的结构体的实例在名`app`的变量中。这个配置是我们添加回调的地方：
|
||||
|
||||
```go {3,9,10} title="main.go"
|
||||
func main() {
|
||||
|
||||
app := NewApp()
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "My App",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
可以在[此处](/docs/howdoesitwork#应用程序生命周期回调)找到有关应用程序生命周期回调的更多信息。
|
||||
|
||||
## 绑定方法
|
||||
|
||||
您可能希望从前端调用 Go 方法。这通常是通过向`app.go`中已经定义的结构体中添加公共方法来实现的：
|
||||
|
||||
```go {16-18} title="app.go"
|
||||
type App struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
func NewApp() *App {
|
||||
return &App{}
|
||||
}
|
||||
|
||||
func (a *App) startup(ctx context.Context) {
|
||||
a.ctx = ctx
|
||||
}
|
||||
|
||||
func (a *App) shutdown(ctx context.Context) {
|
||||
}
|
||||
|
||||
func (a *App) Greet(name string) string {
|
||||
return fmt.Printf("Hello %s!", name)
|
||||
}
|
||||
```
|
||||
|
||||
在主应用程序中，`Bind`字段告诉我们 Wails 想要绑定什么：
|
||||
|
||||
```go {11-13} title="main.go"
|
||||
func main() {
|
||||
|
||||
app := NewApp()
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "My App",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
这将绑定`App`结构中的所有公共方法(它永远不会绑定 startup 和 shutdown 方法)。
|
||||
|
||||
可以在[此处](/docs/howdoesitwork#方法绑定)找到有关绑定的更多信息。
|
||||
|
||||
## 应用程序菜单
|
||||
|
||||
Wails 支持向您的应用程序添加菜单。 这是通过将 [菜单](/docs/reference/menus#菜单) 结构体传递给应用程序配置来完成的。
|
||||
常见做法是使用一个返回菜单的方法，更常见的是用作生命周期回调的 `App` 结构体上的方法。
|
||||
|
||||
```go {11} title="main.go"
|
||||
func main() {
|
||||
|
||||
app := NewApp()
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "My App",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Menu: app.menu(),
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
## 资源
|
||||
|
||||
Wails v2 处理资源的方式的伟大之处在于它没有！你唯一需要给 Wails 的是一个 `embed.FS`， 如何做到这一点完全取决于你。您可以像 vanilla 模板一样使用 vanilla html/css/js 文件。你可能有一些复杂的构建系统，但这并不影响。
|
||||
|
||||
当运行`wails build`时，它会检查项目根目录的`wails.json`文件。文件中有 2 个字段会被读取：
|
||||
|
||||
- "frontend:install"
|
||||
- "frontend:build"
|
||||
|
||||
第一个，如果有给定，将在`frontend`目录中执行以安装 node 模块。第二个，如果有给定，将在`frontend`目录中执行以构建前端项目。
|
||||
|
||||
如果没有给出这两个字段，那么 Wails 不会对前端做任何操作。它仅仅被用作`embed.FS`。
|
||||
@@ -0,0 +1,33 @@
|
||||
---
|
||||
sidebar_position: 99
|
||||
---
|
||||
|
||||
# 参与贡献
|
||||
|
||||
这个页面是关于如何贡献 Wails 项目的指南。
|
||||
|
||||
首先，有一个警告：Wails v2 已经经历了多次迭代和调整。有很多代码要么被搁置要么被弃用。阅读整个项目并试图理解它可能会令人困惑。本文档旨在关注当前的内容以及如何理解当前内容。
|
||||
|
||||
## 漏洞
|
||||
|
||||
对于提出漏洞，请在 GitHub 上打开一个 Issue 并给出[v2]标签。wails doctor 在 Issue 中包含`wails doctor`的输出以帮助我们了解您的环境。
|
||||
|
||||
对于修复漏洞，请在您想要接受的 Issue 上发表评论，我们将在 Issue 上贴上标签。最好使用 Windows，因为它是使用纯 Go 中完成的，调试更容易。
|
||||
|
||||
## 功能
|
||||
|
||||
要请求新功能，请提出一个 Issue 以便讨论。Issue 应带有“Feature Request”标签。这些将被讨论，如果被选中进行开发，将被贴上“Ready for Development”的标签。
|
||||
|
||||
要实现新功能，请按上述方式提出 Issue 或选择带有“Ready for Development”标签的工单。
|
||||
|
||||
在提出 PR 时，请注意说明 PR 已在哪些平台上进行过测试。除非它适用于所有平台（如果可以）,否则任何新功能都不会被接受。
|
||||
|
||||
:::warning 不应该做的
|
||||
|
||||
没有 Issue 的新功能 PR 是没有帮助的，因为 PR 没有上下文，也不会被优先考虑。
|
||||
|
||||
:::
|
||||
|
||||
## 文档
|
||||
|
||||
通过单击任何页面上的“编辑此页”链接，可以轻松地为文档做出贡献。文档更新可以随时完成，无需 Issue。
|
||||
@@ -0,0 +1,31 @@
|
||||
---
|
||||
sidebar_position: 10
|
||||
---
|
||||
|
||||
# 无边框应用
|
||||
|
||||
Wails 支持无边框应用程序。这可以通过使用[应用程序参数选项](/docs/reference/options#应用程序参数选项)中的[无边框](/docs/reference/options#无边框)字段来实现。
|
||||
|
||||
Wails 为拖动窗口提供了一个简单的解决方案：任何具有“data-wails-drag”属性的 HTML 元素都将充当“拖动手柄”。
|
||||
此属性适用于所有嵌套元素。如果您需要指定不应该拖动的嵌套元素，请在该元素上使用属性“data-wails-no-drag”。
|
||||
|
||||
默认的 vanilla 模板使用它，即使它不是无边框的。整个 body 元素被标记为可拖动。`<div id="input" data-wails-no-drag>`元素被标记为不可拖动。
|
||||
|
||||
```html
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="/main.css" />
|
||||
</head>
|
||||
|
||||
<body data-wails-drag>
|
||||
<div id="logo"></div>
|
||||
<div id="input" data-wails-no-drag>
|
||||
<input id="name" type="text" />
|
||||
<button onclick="greet()">Greet</button>
|
||||
</div>
|
||||
<div id="result"></div>
|
||||
|
||||
<script src="/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
@@ -0,0 +1,99 @@
|
||||
---
|
||||
sidebar_position: 20
|
||||
---
|
||||
|
||||
# 手动构建
|
||||
|
||||
Wails CLI 为项目做了很多繁重的工作，但有时需要手动构建项目。本文档将讨论 CLI 执行的不同操作以及如何以不同方式实现这一点。
|
||||
|
||||
## 构建过程
|
||||
|
||||
当使用`wails build`或`wails dev`时，Wails CLI 会执行一个通用的构建过程：
|
||||
|
||||
- 安装前端依赖
|
||||
- 构建前端项目
|
||||
- 生成构建资源
|
||||
- 编译应用程序
|
||||
- [可选]压缩应用程序
|
||||
|
||||
### 安装前端依赖
|
||||
|
||||
#### 命令行步骤
|
||||
|
||||
- 如果给出了`-s`标志，则跳过此步骤
|
||||
- 检查`wails.json`中是否有安装命令`frontend:install`
|
||||
- 如果没有，则跳过此步骤
|
||||
- 如果有，则检查前端目录中是否存在`package.json`。如果不存在，则跳过这一步
|
||||
- 从`package.json`文件内容生成 MD5
|
||||
- 它检查`package.json.md5`是否存在，如果存在，则将其内容（MD5 sum）与生成的内容进行比较，以查看内容是否已更改。如果相同，则跳过此步骤
|
||||
- 如果`package.json.md5`不存在，则使用生成的 MD5 sum 创建它
|
||||
- 如果现在需要构建，或者`node_modules`不存在，或者给出了`-f`标志，则在前端目录中执行安装命令
|
||||
|
||||
#### 手动步骤
|
||||
|
||||
这一步可以从命令行或带有`npm install`的前端脚本完成.
|
||||
|
||||
### 构建前端项目
|
||||
|
||||
#### Wails 命令行
|
||||
|
||||
- 如果给出了`-s`标志，则跳过此步骤
|
||||
- 检查`wails.json`中是否有构建命令`frontend:build`
|
||||
- 如果没有，则跳过此步骤
|
||||
- 如果有，就在 frontend 目录下执行它
|
||||
|
||||
#### 手动步骤
|
||||
|
||||
这一步可以从命令行或带有前端构建脚本`npm run build`的脚本或任何前端构建脚本完成。
|
||||
|
||||
### 生成资源
|
||||
|
||||
#### Wails 命令行
|
||||
|
||||
- 如果设置了`-nopackage`标志，则跳过此阶段
|
||||
- 如果`build/appicon.png`文件不存在，则创建一个默认文件
|
||||
- 对于 Windows，请参阅[Windows](#windows)
|
||||
- 如果`build/windows/icon.ico`不存在，它将从`build/appicon.png`图像创建它。
|
||||
|
||||
##### Windows
|
||||
|
||||
- 它创建的图标大小有 256、128、64、48、32 和 16。这是使用[winicon](https://github.com/leaanthony/winicon)完成的。
|
||||
- 如果`build/windows/<projectname>.manifest`文件不存在，它会从默认版本创建它。
|
||||
- 将应用程序编译为生产版本（如上所述）。
|
||||
- 使用[winres](https://github.com/tc-hib/winres)将 icon 和 manifest 打包到一个`.syso`文件。
|
||||
|
||||
#### 手动步骤
|
||||
|
||||
- 使用[winicon](https://github.com/leaanthony/winicon)命令行工具或者其他工具创建`icon.ico`
|
||||
- 为您的应用程序创建或者更新`.manifest`文件
|
||||
- 使用[winres 命令行](https://github.com/tc-hib/go-winres)生成一个`.syso`文件
|
||||
|
||||
### 编译应用程序
|
||||
|
||||
#### Wails 命令行
|
||||
|
||||
- 如果提供了`-clean`标志，则删除并重新创建`build`目录
|
||||
- 对于`wails dev`，使用以下默认 Go 标志：`-tags dev -gcflags "all=-N -l"`
|
||||
- 对于`wails build`，使用以下默认 Go 标志：`-tags desktop,production -ldflags "-w -s"`
|
||||
- 在 Windows 上， `-ldflags "-w -h -H windowsgui"`
|
||||
- 使用`-tags`传递给命令行的其他`tags`被添加到默认值中
|
||||
- 使用`-ldflags`传递给命令行的其他`ldflags`将添加到默认值中
|
||||
- 传递`-o`标志
|
||||
- 指定的`-compiler`将用于 Go 编译器
|
||||
|
||||
#### 手动步骤
|
||||
|
||||
- 开发环境构建，最简单的命令是： `go build -tags dev -gcflags "all=-N -l"`
|
||||
- 生产环境构建，最简单的命令是：`go build -tags desktop,production -ldflags "-w -s -H windowsgui"`
|
||||
- 确保在与`.syso`文件相同的目录中进行编译
|
||||
|
||||
### 压缩应用程序
|
||||
|
||||
#### Wails 命令行
|
||||
|
||||
- 如果已给出`-upx`标志，则`upx`程序将运行以使用默认设置压缩应用程序
|
||||
- 如果也传递了`-upxflags`标志，则使用这些标志而不是默认
|
||||
|
||||
#### 手动步骤
|
||||
|
||||
- 手动运行`upx [flags]`以压缩应用程序。
|
||||
@@ -0,0 +1,192 @@
|
||||
---
|
||||
title: 从 v1 迁移
|
||||
sidebar_position: 98
|
||||
---
|
||||
|
||||
# 从 v1 迁移
|
||||
|
||||
## 概述
|
||||
|
||||
Wails v2 与 v1 相比有重大变化。本文档旨在重点介绍迁移现有项目的更改和步骤。
|
||||
|
||||
### 创建应用程序
|
||||
|
||||
在 v1 中，使用`wails.CreateApp`来创建主应用程序，使用`app.Bind`来添加绑定，然后使用`app.Run()`运行应用程序。
|
||||
|
||||
示例：
|
||||
|
||||
```go title="v1"
|
||||
app := wails.CreateApp(&wails.AppConfig{
|
||||
Title: "MyApp",
|
||||
Width: 1024,
|
||||
Height: 768,
|
||||
JS: js,
|
||||
CSS: css,
|
||||
Colour: "#131313",
|
||||
})
|
||||
app.Bind(basic)
|
||||
app.Run()
|
||||
```
|
||||
|
||||
在 v2 中，只有一个方法`wails.Run()`接受[应用程序参数选项](/docs/reference/options#应用程序参数选项)。
|
||||
|
||||
```go title="v2"
|
||||
err := wails.Run(&options.App{
|
||||
Title: "MyApp",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
Assets: assets,
|
||||
Bind: []interface{}{
|
||||
basic,
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
### 绑定
|
||||
|
||||
在 v1 中，可以绑定任意函数和结构。在 v2 中，这已被简化为仅绑定结构。以前传递给 v1`Bind()`中的方法的结构实例现在在[应用程序参数选项](/docs/reference/options#应用程序参数选项)`Bind`字段中指定：
|
||||
|
||||
```go title="v1"
|
||||
app := wails.CreateApp(/* options */)
|
||||
app.Bind(basic)
|
||||
```
|
||||
|
||||
```go title="v2"
|
||||
err := wails.Run(&options.App{
|
||||
/* other options */
|
||||
Bind: []interface{}{
|
||||
basic,
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
在 v1 中，绑定方法在`window.backend`中。 这已更改为`window.go`。
|
||||
|
||||
### 应用程序生命周期
|
||||
|
||||
在 v1 中，绑定结构中有 2 个特殊方法：`WailsInit()`和`WailsShutdown()`. 这些已被替换为 3 个生命周期回调，作为[应用程序参数选项](/docs/reference/options#应用程序参数选项)的一部分：
|
||||
|
||||
- [应用启动回调](/docs/reference/options#应用启动回调)
|
||||
- [应用退出回调](/docs/reference/options#应用退出回调)
|
||||
- [前端 Dom 加载完成回调](/docs/reference/options#前端-dom-加载完成回调)
|
||||
|
||||
注意：[前端 Dom 加载完成回调](/docs/reference/options#前端-dom-加载完成回调)替换了 v1 中的 `wails:ready` 系统事件。
|
||||
|
||||
这些方法可以是标准函数，但通常的做法是将它们作为结构的一部分：
|
||||
|
||||
```go title="v2"
|
||||
basic := NewBasicApp()
|
||||
err := wails.Run(&options.App{
|
||||
/* Other Options */
|
||||
OnStartup: basic.startup,
|
||||
OnShutdown: basic.shutdown,
|
||||
OnDomReady: basic.domready,
|
||||
})
|
||||
...
|
||||
type Basic struct {
|
||||
ctx context.Context
|
||||
}
|
||||
func (b *Basic) startup(ctx context.Context) {
|
||||
b.ctx = ctx
|
||||
}
|
||||
...
|
||||
```
|
||||
|
||||
### 运行时
|
||||
|
||||
v2 中的运行时比 v1 丰富得多，支持菜单、窗口操作和更好的对话框。方法的签名略有变化 - 请参阅[运行时](/docs/reference/runtime/intro)。
|
||||
|
||||
在 v1 中，[运行时](/docs/reference/runtime/intro)可通过传递给`WailsInit()`. 在 v2 中，运行时已移出到它自己的包。运行时中的每个方法都采用`context.Context`传递给了[应用启动回调](/docs/reference/options#应用启动回调)方法。
|
||||
|
||||
```go title="运行时示例"
|
||||
package main
|
||||
|
||||
import "github.com/wailsapp/wails/v2/pkg/runtime"
|
||||
|
||||
type Basic struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
// startup is called at application startup
|
||||
func (a *App) startup(ctx context.Context) {
|
||||
a.ctx = ctx
|
||||
runtime.LogInfo(ctx, "Application Startup called!")
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
### 资源
|
||||
|
||||
在 v2 最大的变化是资源的处理方式。
|
||||
|
||||
在 v1 中，资源通过 2 个应用程序参数选项传递：
|
||||
|
||||
- `JS` - 应用程序的 Javascript
|
||||
- `CSS` - 应用程序的 CSS
|
||||
|
||||
这意味着生成单个 JS 和 CSS 文件的责任在于开发人员。这本质上需要使用繁琐的打包程序，例如 webpack。
|
||||
|
||||
在 v2 中，Wails 不对你的前端资源做任何预设，就像网络服务器一样。你的所有应用程序资源都作为`embed.FS`.
|
||||
|
||||
**这意味着不需要打包你的资源、将图像编码为 Base64 或尝试使用奇葩的打包器配置来使用自定义字体。**
|
||||
|
||||
在启动时，Wails 将扫描给定的`embed.FS`的`index.html`并将其位置用作所有其他应用程序资源的根路径 - 就像网络服务器一样。
|
||||
|
||||
示例：应用程序具有以下项目布局。所有最终资源都放在 `frontend/dist`目录中：
|
||||
|
||||
```shell
|
||||
.
|
||||
├── build/
|
||||
├── frontend/
|
||||
│ └── dist/
|
||||
│ ├── index.html
|
||||
│ ├── main.js
|
||||
│ ├── main.css
|
||||
│ └── logo.svg
|
||||
├── main.go
|
||||
└── wails.json
|
||||
```
|
||||
|
||||
应用程序可以通过简单地创建一个`embed.FS`来使用这些资源：
|
||||
|
||||
```go title="资源示例"
|
||||
//go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
|
||||
func main() {
|
||||
err := wails.Run(&options.App{
|
||||
/* Other Options */
|
||||
Assets: assets,
|
||||
})
|
||||
}
|
||||
```
|
||||
|
||||
当然，如果你愿意，也可以使用打包器。唯一的要求是在 Wails 中使用`embed.FS`,将最终的程序资源目录传递给[应用程序参数选项](/docs/reference/options#应用程序参数选项)的`Assets`键。
|
||||
|
||||
### 项目配置
|
||||
|
||||
在 v1 中，项目配置存储在项目根的 `project.json` 文件中。
|
||||
在 v2 中，项目配置存储在项目根部的 `wails.json` 文件中。
|
||||
|
||||
文件的格式略有不同。下面是区别：
|
||||
|
||||
<p align="center">
|
||||
|
||||
| v1 | v2 | 笔记 |
|
||||
| ------------------ | ---------------- | ---------------------------- |
|
||||
| name | name | |
|
||||
| description | | 移除 |
|
||||
| author / name | author / name | |
|
||||
| author / email | author / email | |
|
||||
| version | version | |
|
||||
| binaryname | outputfilename | 变更 |
|
||||
| frontend / dir | | 移除 |
|
||||
| frontend / install | frontend:install | 变更 |
|
||||
| frontend / build | frontend:build | 变更 |
|
||||
| frontend / bridge | | 移除 |
|
||||
| frontend / serve | | 移除 |
|
||||
| tags | | 移除 |
|
||||
| | wailsjsdir | 生成 wailsjs 模块的目录 |
|
||||
| | assetdir | `dev` 模式下前端资源文件目录 |
|
||||
|
||||
</p>
|
||||
@@ -0,0 +1,95 @@
|
||||
---
|
||||
sidebar_position: 15
|
||||
---
|
||||
|
||||
# 模板
|
||||
|
||||
Wails 从预先创建的模板生成项目。在 v1 中，这是一组难以维护的项目，这些项目可能会过时。在 v2 中，为了增强社区的能力，为模板添加了一些新功能：
|
||||
|
||||
- 能够从[远程模板](/docs/reference/cli#远程模板)生成项目
|
||||
- 帮助创建自己的模板的工具
|
||||
|
||||
## 创建模板
|
||||
|
||||
要创建模板，您可以使用`wails generate template`命令。要生成默认模板，请运行：
|
||||
|
||||
`wails generate template -name mytemplate `
|
||||
|
||||
这将使用默认文件创建“mytemplate”目录：
|
||||
|
||||
```shell title=mytemplate/
|
||||
.
|
||||
|-- NEXTSTEPS.md
|
||||
|-- README.md
|
||||
|-- app.tmpl.go
|
||||
|-- frontend
|
||||
| `-- dist
|
||||
| |-- assets
|
||||
| | |-- fonts
|
||||
| | | |-- OFL.txt
|
||||
| | | `-- nunito-v16-latin-regular.woff2
|
||||
| | `-- images
|
||||
| | `-- logo-dark.svg
|
||||
| |-- index.html
|
||||
| |-- main.css
|
||||
| `-- main.js
|
||||
|-- go.mod.tmpl
|
||||
|-- main.tmpl.go
|
||||
|-- template.json
|
||||
`-- wails.tmpl.json
|
||||
```
|
||||
|
||||
### 模板概述
|
||||
|
||||
默认模板包含以下文件和目录：
|
||||
|
||||
| 文件名 / 目录 | 描述 |
|
||||
| --------------- | ---------------------- |
|
||||
| NEXTSTEPS.md | 有关如何完成模板的说明 |
|
||||
| README.md | 随模板发布的 README |
|
||||
| app.tmpl.go | `app.go` 模板文件 |
|
||||
| frontend/ | 包含前端资源的目录 |
|
||||
| go.mod.tmpl | `go.mod` 模板文件 |
|
||||
| main.tmpl.go | `main.go` 模板文件 |
|
||||
| template.json | 模板元数据 |
|
||||
| wails.tmpl.json | `wails.json` 模板文件 |
|
||||
|
||||
此时，建议按照`NEXTSTEPS.md`中的步骤操作。
|
||||
|
||||
## 从现有项目创建模板
|
||||
|
||||
通过在生成模板时将路径传递给项目，可以从现有的前端项目创建模板。我们现在将介绍如何创建 Vue 3 模板：
|
||||
|
||||
- 安装 vue cli： `npm install -g @vue/cli`
|
||||
- 创建默认项目：`vue create vue3-base`
|
||||
- 选择 `Default (Vue 3) ([Vue 3] babel, eslint)`
|
||||
- 项目生成后，运行：
|
||||
|
||||
```shell
|
||||
> wails generate template -name wails-vue3-template -frontend .\vue3-base\
|
||||
Extracting base template files...
|
||||
Migrating existing project files to frontend directory...
|
||||
Updating package.json data...
|
||||
Renaming package.json -> package.tmpl.json...
|
||||
Updating package-lock.json data...
|
||||
Renaming package-lock.json -> package-lock.tmpl.json...
|
||||
```
|
||||
|
||||
- 现在可以按照`NEXTSTEPS.md`中指定的方式定制模板。
|
||||
- 一旦文件准备完毕，就可以通过运行命令来测试它：`wails init -n my-vue3-project -t .\wails-vue3-template\`
|
||||
- 要测试新项目，请运行：`cd my-vue3-project` then `wails build`
|
||||
- 项目编译完成后，运行它：`.\build\bin\my-vue3-project.exe`
|
||||
- 你应该有了一个功能齐全的 Vue3 应用程序：
|
||||
|
||||
<div className="text--center">
|
||||
<img src="/img/vue3-template.png" width="50%" />
|
||||
</div>
|
||||
|
||||
## 发布模板
|
||||
|
||||
发布模板只是将文件推送到 GitHub。鼓励以下最佳实践：
|
||||
|
||||
- 从前端目录中删除任何不需要的文件和目录（例如：.git）
|
||||
- 确保`template.json`完整，尤其是`helpurl`
|
||||
- 将文件推送到 GitHub
|
||||
- 在[社区模板](/docs/community/templates)页面上创建 PR
|
||||
@@ -0,0 +1,35 @@
|
||||
---
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# Windows 系统
|
||||
|
||||
此页面包含了在 Windows 上开发 Wails 应用程序相关的其他指南。
|
||||
|
||||
## 处理 WebView2 运行时依赖
|
||||
|
||||
为 Windows 构建 Wails 应用程序时对 Microsoft [WebView2 运行时](https://developer.microsoft.com/en-us/microsoft-edge/webview2/)有要求。
|
||||
默认情况下，Windows 11 会安装它，但有些机器不会。Wails 提供了一种简单的方法来处理这种依赖关系。
|
||||
|
||||
通过在构建时使用`-webview2`标志,您可以决定在未检测到合适的运行时的时候（包括安装的运行时是否太旧）应用程序将执行的操作。四个选项是：
|
||||
|
||||
1. 下载
|
||||
2. 内嵌
|
||||
3. 浏览器
|
||||
4. 错误
|
||||
|
||||
### 下载
|
||||
|
||||
此选项将提示用户在未找到合适的运行时时，提供从 Microsoft 的 WebView2 官方站点下载并运行引导程序。如果用户继续，官方引导程序将被下载并运行。
|
||||
|
||||
### 内嵌
|
||||
|
||||
此选项将官方引导程序嵌入到应用程序中。如果没有找到合适的运行时，应用程序将提供并运行引导程序。这将使二进制大小增加约 150k。
|
||||
|
||||
### 浏览器
|
||||
|
||||
此选项将提示用户没有找到合适的运行时时，提供打开浏览器到 WebView2 官方页面，可以下载和安装引导程序。然后应用程序将会退出，安装的操作留给用户。
|
||||
|
||||
### 错误
|
||||
|
||||
如果未找到合适的运行时间，则会向用户显示错误并且不采取进一步措施。
|
||||
@@ -0,0 +1,282 @@
|
||||
---
|
||||
title: 它如何工作
|
||||
sidebar_position: 3
|
||||
---
|
||||
|
||||
# 它如何工作？
|
||||
|
||||
Wails 应用程序是一个标准的 Go 应用程序，带有一个 webkit 前端。Wails 应用程序的架构是：
|
||||
|
||||
<div className="text--center">
|
||||
<img src="/img/architecture.svg" width="75%" />
|
||||
</div>
|
||||
|
||||
## 后端
|
||||
|
||||
### 概述
|
||||
|
||||
主应用程序，通常称为“后端”，由对`wails.Run()`的调用组成. 它接收应用程序配置，该配置说明应用程序应该有多大尺寸，标题栏应该显示什么，使用什么资源等。一个基本的应用程序可能看起来像这样：
|
||||
|
||||
```go title="main.go"
|
||||
package main
|
||||
|
||||
import (
|
||||
"embed"
|
||||
"log"
|
||||
|
||||
"github.com/wailsapp/wails/v2"
|
||||
"github.com/wailsapp/wails/v2/pkg/options"
|
||||
)
|
||||
|
||||
//go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
|
||||
func main() {
|
||||
|
||||
app := &App{}
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "Basic Demo",
|
||||
Width: 1024,
|
||||
Height: 768,
|
||||
Assets: &assets,
|
||||
OnStartup: app.startup,
|
||||
OnShutdown: app.shutdown,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
type App struct {
|
||||
ctx context.Context
|
||||
}
|
||||
|
||||
func (b *App) startup(ctx context.Context) {
|
||||
b.ctx = ctx
|
||||
}
|
||||
|
||||
func (b *App) shutdown(ctx context.Context) {}
|
||||
|
||||
func (b *App) Greet(name string) string {
|
||||
return fmt.Sprintf("Hello %s!", name)
|
||||
}
|
||||
```
|
||||
|
||||
### 选项概要
|
||||
|
||||
此示例设置了以下选项：
|
||||
|
||||
- `Title` - 应该出现在窗口标题栏中的文本
|
||||
- `Width&Height`- 窗口的尺寸
|
||||
- `Assets` - 应用程序的前端资源
|
||||
- `OnStartup` - 创建窗口并即将开始加载前端资源时的回调
|
||||
- `OnShutdown` - 应用程序即将退出时的回调
|
||||
- `Bind` - 我们希望向前端暴露的一部分结构体实例
|
||||
|
||||
完整的应用程序参数选项列表可以在[参数选项](/docs/reference/options)中找到。
|
||||
|
||||
#### 资源
|
||||
|
||||
`Assets` 选项是必须的，因为你不能拥有没有前端资源的 Wails 应用程序。这些资源可以是你希望在 Web 应用程序中找到的任何文件 - html、js、css、svg、png 等。
|
||||
不需要生成资源包- 纯文件即可。当应用程序启动时，它将尝试从你的资源中加载`index.html`，并且那时起前端基本上将作为浏览器工作。值得注意的是 embed.FS，
|
||||
文件所在的位置没有要求。嵌入路径很可能使用了相对于你的主应用程序代码的嵌套目录，例如 `frontend/dist`：
|
||||
|
||||
```go title="main.go"
|
||||
// go:embed frontend/dist
|
||||
var assets embed.FS
|
||||
```
|
||||
|
||||
启动时，Wails 将遍历嵌入的文件，寻找包含的`index.html`. 所有其他资源将相对于该目录加载。
|
||||
|
||||
由于生产二进制文件使用中包含在`embed.FS`的文件，因此应用程序不需要附带任何外部文件。
|
||||
|
||||
在`dev`模式下，资源从磁盘加载，任何更改都会导致“实时重新加载”。资源的位置需要传递给`dev`命令，并且很可能与嵌入路径相同。更多细节可以在[应用程序开发指南](/docs/guides/appdev)中找到。
|
||||
|
||||
#### 应用程序生命周期回调
|
||||
|
||||
在即将加载前端`index.html`之前，对 [应用启动回调](/docs/reference/options#应用启动回调) 中提供的函数进行回调。一个标准的 Go 上下文被传递给这个方法。
|
||||
调用运行时需要此上下文，因此标准模式是保存此时对它的引用。在应用程序关闭之前，以同样的方式调用 [应用退出回调](/docs/reference/options#应用退出回调) 回调，
|
||||
再次使用上下文。当前端加载所有资源时，还有一个 [前端 Dom 加载完成回调](/docs/reference/options#前端-dom-加载完成回调) 回调。
|
||||
|
||||
#### 方法绑定
|
||||
|
||||
`Bind`选项是 Wails 应用程序中最重要的参数选项之一。它指定向前端暴露哪些结构方法。当应用程序启动时，它会检查 `Bind` 中列出的结构实例，确定哪些方法是公开的（以大写字母开头），并将生成前端可以调用的那些方法的 Javascript 版本。
|
||||
|
||||
这些方法位于前端 `window.go.<packagename>.<struct>.<method>`。在上面的例子中，我们绑定 `app`，它有一个公开方法 `Greet`。这可以通过在 `Javascript` 中用 `window.go.main.App.Greet`调用。这些方法返回一个 Promise。成功的调用将导致 Go 调用的第一个返回值被传递给 resolve 处理程序。一个不成功的调用是将一个 Go 方法的第二个错误类型返回值传递回调用者。这是通过`reject`传回的。在上面的例子中，Greet 只返回一个字符串，所以 `Javascript` 调用永远不会`reject` - 除非将无效数据传递给它。
|
||||
|
||||
所有数据类型都在 Go 和 Javascript 之间正确转换。包括结构体。如果你从 Go 调用返回一个结构体，它将作为 `Javascript` Map 返回到你的前端。注意：如果你想使用结构体，你必须为你的结构体字段定义`json` 标签！也可以将结构体发送回 Go。任何作为期望结构的参数传递的 Javascript Map 都将转换为该结构类型。为了使这个过程更容易，在 `dev`模式下，会生成一个 TypeScript 模块，定义绑定方法中使用的所有结构类型。使用此模块，可以构建原生 Javascript 对象并将其发送到 Go 代码。
|
||||
|
||||
有关绑定的更多信息可以在[绑定示例](/docs/examples/binding)页面中找到。
|
||||
|
||||
## 前端
|
||||
|
||||
### 概述
|
||||
|
||||
前端是由 webkit 渲染的文件集合。这就像浏览器和网络服务器合二为一。您可以使用的框架或库[^1]几乎没有限制。前端和 Go 代码之间的主要交互点是：
|
||||
|
||||
- 调用绑定的 Go 方法
|
||||
- 调用运行时方法
|
||||
|
||||
[^1]: 有一小部分库使用了 WebView 中不支持的功能。对于这种情况，通常有替代方案和解决方法。
|
||||
|
||||
### 调用绑定的 Go 方法
|
||||
|
||||
所有绑定的 Go 方法都可以在`window.go.<package>.<struct>.<method>`调用. 如上一节所述，这些方法返回一个 Promise，其中成功调用将值返回给 resolve 处理程序，错误将值返回给 reject 处理程序。
|
||||
|
||||
```go title="mycode.js"
|
||||
window.go.main.App.Greet("Bill").then((result) => {
|
||||
console.log("The greeting is: " + result);
|
||||
})
|
||||
```
|
||||
|
||||
在`dev`模式下运行应用程序时，会生成一个 javascript 模块，用 JSDoc 注释包装这些方法。这确实有助于开发，尤其是因为大多数 IDE 将处理 JSDoc 以提供代码完成和类型提示。该模块名为`go` 并在`wailsjsdir`标志指定的目录中生成。在这个模块中有一个`bindings.js`的文件，其中包含这些包装器。对于上面的示例，该文件包含以下代码：
|
||||
|
||||
```js title="bindings.js"
|
||||
const go = {
|
||||
main: {
|
||||
App: {
|
||||
/**
|
||||
* Greet
|
||||
* @param {Person} arg1 - Go Type: string
|
||||
* @returns {Promise<string>} - Go Type: string
|
||||
*/
|
||||
Greet: (arg1) => {
|
||||
return window.go.main.App.Greet(arg1);
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
export default go;
|
||||
```
|
||||
|
||||
#### 支持结构体
|
||||
|
||||
还额外支持在其签名中使用结构的 Go 方法。所有由绑定方法指定的 Go 结构体（作为参数或返回类型）都将自动生成 Typescript 版本作为 Go 代码包装器模块的一部分。
|
||||
使用这些，可以在 Go 和 Javascript 之间共享相同的数据模型。这些模型与 JSDoc 注释一致，支持 IDE 代码自动完成。
|
||||
|
||||
示例：我们更新我们的`Gree`方法以接受一个`Person`而不是字符串：
|
||||
|
||||
```go title="main.go"
|
||||
type Person struct {
|
||||
Name string `json:"name"`
|
||||
Age uint8 `json:"age"`
|
||||
Address *Address `json:"address"`
|
||||
}
|
||||
|
||||
type Address struct {
|
||||
Street string `json:"street"`
|
||||
Postcode string `json:"postcode"`
|
||||
}
|
||||
|
||||
func (a *App) Greet(p Person) string {
|
||||
return fmt.Sprintf("Hello %s (Age: %d)!", p.Name, p.Age)
|
||||
}
|
||||
```
|
||||
|
||||
我们的`bindings.js`文件现已更新以反映更改：
|
||||
|
||||
```js title="bindings.js"
|
||||
const go = {
|
||||
main: {
|
||||
App: {
|
||||
/**
|
||||
* Greet
|
||||
* @param {Person} arg1 - Go Type: main.Person
|
||||
* @returns {Promise<string>} - Go Type: string
|
||||
*/
|
||||
Greet: (arg1) => {
|
||||
return window.go.main.App.Greet(arg1);
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
export default go;
|
||||
```
|
||||
|
||||
此外`bindings.js`，还有一个名为`models.ts`的文件. 这包含我们的 TypeScript 形式的 Go 结构：
|
||||
|
||||
```ts title="models.ts"
|
||||
export class Address {
|
||||
street: string;
|
||||
postcode: string;
|
||||
|
||||
static createFrom(source: any = {}) {
|
||||
return new Address(source);
|
||||
}
|
||||
|
||||
constructor(source: any = {}) {
|
||||
if ("string" === typeof source) source = JSON.parse(source);
|
||||
this.street = source["street"];
|
||||
this.postcode = source["postcode"];
|
||||
}
|
||||
}
|
||||
export class Person {
|
||||
name: string;
|
||||
age: number;
|
||||
address?: Address;
|
||||
|
||||
static createFrom(source: any = {}) {
|
||||
return new Person(source);
|
||||
}
|
||||
|
||||
constructor(source: any = {}) {
|
||||
if ("string" === typeof source) source = JSON.parse(source);
|
||||
this.name = source["name"];
|
||||
this.age = source["age"];
|
||||
this.address = this.convertValues(source["address"], Address);
|
||||
}
|
||||
|
||||
convertValues(a: any, classs: any, asMap: boolean = false): any {
|
||||
if (!a) {
|
||||
return a;
|
||||
}
|
||||
if (a.slice) {
|
||||
return (a as any[]).map((elem) => this.convertValues(elem, classs));
|
||||
} else if ("object" === typeof a) {
|
||||
if (asMap) {
|
||||
for (const key of Object.keys(a)) {
|
||||
a[key] = new classs(a[key]);
|
||||
}
|
||||
return a;
|
||||
}
|
||||
return new classs(a);
|
||||
}
|
||||
return a;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
只要你将 TypeScript 作为前端构建配置的一部分，你就可以通过以下方式使用这些模型：
|
||||
|
||||
```js title="mycode.js"
|
||||
import go from "./wailsjs/go/bindings";
|
||||
import { Person } from "./wailsjs/go/models";
|
||||
|
||||
let name = "";
|
||||
|
||||
function greet(name) {
|
||||
let p = new Person();
|
||||
p.name = name;
|
||||
p.age = 42;
|
||||
go.main.App.Greet(p).then((result) => {
|
||||
console.log(result);
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
JSDoc 和 TypeScript 生成模型的组合构成了一个强大的开发环境。
|
||||
|
||||
### 调用运行时方法
|
||||
|
||||
Javascript 运行时位于`window.runtime`并包含许多方法来执行各种任务，例如发出事件或执行日志记录操作：
|
||||
|
||||
```js title="mycode.js"
|
||||
window.runtime.EventsEmit("my-event", 1);
|
||||
```
|
||||
|
||||
可以在[运行时参考](/docs/reference/runtime/intro)中找到有关 JS 运行时的更多详细信息。
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Reference",
|
||||
"position": 3
|
||||
}
|
||||
@@ -0,0 +1,167 @@
|
||||
---
|
||||
title: 命令行
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# 命令行
|
||||
|
||||
Wails CLI 有许多用于管理项目的命令。所有命令都以此方式运行：
|
||||
|
||||
`wails <command> <flags>`
|
||||
|
||||
## 初始化
|
||||
|
||||
`wails init` 用于生成项目。
|
||||
|
||||
| 标志 | 描述 | 默认 |
|
||||
| :----------------- | :------------------------------------------------------------------ | :------ |
|
||||
| -n "project name" | 项目名. **强制必填**. | |
|
||||
| -d "project dir" | 要创建的项目目录 | 项目名 |
|
||||
| -g | 初始化 git 存储库 | |
|
||||
| -l | 可用项目模板列表 | |
|
||||
| -q | 禁止输出到控制台 | |
|
||||
| -t "template name" | 要使用的项目模板。这可能是在 github 上托管的远程模板的 URL 的名称。 | vanilla |
|
||||
| -vscode | 生成 VSCode 项目文件 | |
|
||||
| -f | 强制构建应用 | false |
|
||||
|
||||
示例：
|
||||
`wails init -n test -d mytestproject -g -vscode -q`
|
||||
|
||||
这将在 "mytestproject" 目录生成一个名为 "test" 的项目，初始化 git，生成 vscode 项目文件并静默执行。
|
||||
|
||||
### 远程模板
|
||||
|
||||
支持远程模板（托管在 GitHub 上）并且可以使用模板的项目 URL 进行安装。
|
||||
|
||||
示例： `wails init -n test -t https://github.com/leaanthony/testtemplate`
|
||||
|
||||
可以在[此处](/docs/community/templates)找到社区维护的模板列表
|
||||
|
||||
:::warning 注意
|
||||
|
||||
**Wails 项目不维护也不对第 3 方模板负责**
|
||||
|
||||
如果你不确定某个模板，请检查 `package.json` 中运行的脚本和安装的模块。
|
||||
|
||||
:::
|
||||
|
||||
## 构建
|
||||
|
||||
`wails build`用于将你的项目编译为生产可用的二进制文件。
|
||||
|
||||
| 标志 | 描述 | 默认 |
|
||||
| :------------------- | :----------------------------------------------------- | :------- |
|
||||
| -clean | 清理`build/bin`目录 | |
|
||||
| -compiler "compiler" | 使用不同的 go 编译器来构建，例如 go1.15beta1 | go |
|
||||
| -ldflags "flags" | 传递给编译器的额外 ldflags | |
|
||||
| -nopackage | 不打包应用程序 | |
|
||||
| -o filename | 输出文件名 | |
|
||||
| -s | 跳过前端构建 | |
|
||||
| -f | 强制构建应用 | false |
|
||||
| -tags "extra tags" | 传递给编译器构建标签（引号和空格分隔） | |
|
||||
| -upx | 使用“upx”压缩最终二进制文件 | |
|
||||
| -upxflags | 传递给 upx 的 flags | |
|
||||
| -v int | 详细级别 (0 - silent, 1 - default, 2 - verbose) | 1 |
|
||||
| -webview2 | WebView2 安装程序策略：: download,embed,browser,error. | download |
|
||||
|
||||
如果您更喜欢使用标准 Go 工具进行构建，请参阅[手动构建](/docs/guides/manual-builds)指南。
|
||||
|
||||
## 诊断检查
|
||||
|
||||
`wails doctor` 将运行诊断程序以确保你的系统已准备好进行开发。
|
||||
|
||||
示例:
|
||||
|
||||
```
|
||||
Wails CLI v2.0.0-beta
|
||||
|
||||
Scanning system - Please wait (this may take a long time)...Done.
|
||||
|
||||
System
|
||||
------
|
||||
OS: Windows 10 Pro
|
||||
Version: 2009 (Build: 19043)
|
||||
ID: 21H1
|
||||
Go Version: go1.17
|
||||
Platform: windows
|
||||
Architecture: amd64
|
||||
|
||||
Dependency Package Name Status Version
|
||||
---------- ------------ ------ -------
|
||||
WebView2 N/A Installed 93.0.961.52
|
||||
npm N/A Installed 6.14.15
|
||||
*upx N/A Installed upx 3.96
|
||||
*docker N/A Installed 20.10.6
|
||||
|
||||
* - Optional Dependency
|
||||
|
||||
Diagnosis
|
||||
---------
|
||||
Your system is ready for Wails development!
|
||||
|
||||
```
|
||||
|
||||
## 开发
|
||||
|
||||
`wails dev` 用于以 "实时开发" 模式运行你的应用。这意味着：
|
||||
|
||||
- 应用程序被编译并自动运行
|
||||
- 一个观察者被启动，如果它检测到你的 go 文件的变化，它将触发你的开发应用程序的重新构建
|
||||
- 启动一个网络服务器`http://localhost:34115`，通过 http 为你的应用程序（不仅仅是前端）提供服务。这允许你使用你喜欢的浏览器开发扩展
|
||||
- 所有应用程序资源都从磁盘加载。如果它们被更改，应用程序将自动重新加载（而不是重新构建）。所有连接的浏览器也将重新加载
|
||||
- 生成的 JS 模块提供以下内容：
|
||||
- 带有自动生成的 JSDoc 的 Go 方法的 Javascript 包装器，提供代码提示
|
||||
- 的 Go 结构体的 TypeScript 版本，可以构造并传递给你的后端方法
|
||||
- 生成第二个 JS 模块，为运行时提供包装器 + TS 声明
|
||||
|
||||
| 标志 | 描述 | 默认 |
|
||||
| :--------------------------- | :---------------------------------------------------- | :-------------------------- |
|
||||
| -assetdir "./path/to/assets" | 编译资源的路径 | Value in `wails.json` |
|
||||
| -browser | `http://localhost:34115`在启动时打开浏览器 | |
|
||||
| -compiler "compiler" | 使用不同的 go 编译器来构建，例如 go1.15beta1 | go |
|
||||
| -e | 触发重建的扩展（逗号分隔） | go |
|
||||
| -ldflags "flags" | 传递给编译器的额外 ldflags | |
|
||||
| -tags "extra tags" | 构建标签以传递给编译器（引号和空格分隔） | |
|
||||
| -loglevel "loglevel" | 要使用的日志级别 - Trace, Debug, Info, Warning, Error | Debug |
|
||||
| -noreload | 资源更改时禁用自动重新加载 | |
|
||||
| -v | 详细级别 (0 - silent, 1 - standard, 2 - verbose) | 1 |
|
||||
| -wailsjsdir | 生成生成的 Wails JS 模块的目录 | Value store in `wails.json` |
|
||||
|
||||
如果在命令行上提供了`-assetdir`或`-wailsjsdir`标志，它们将保存在`wails.json`中，并成为后续调用的默认值。
|
||||
|
||||
示例：
|
||||
|
||||
`wails dev -assetdir ./frontend/dist -wailsjsdir ./frontend/src -browser`
|
||||
|
||||
此命令将执行以下操作：
|
||||
|
||||
- 构建应用程序并运行它（更多细节在[这里](/docs/guides/manual-builds)）
|
||||
- 生成 Wails JS 模块 ``./frontend/src`
|
||||
- 注意文件的更新`./frontend/dist`并在任何更改时重新加载
|
||||
- 打开浏览器并连接到应用程序
|
||||
|
||||
## 生成
|
||||
|
||||
### 模板
|
||||
|
||||
Wails 使用模板来生成项目。`wails generate template`命令有助于构建模板，以使它可以用于生成项目。
|
||||
|
||||
| 标志 | 描述 |
|
||||
| :--------------- | :----------------------------- |
|
||||
| -name | 模板名称（必填） |
|
||||
| -frontend "path" | 要在模板中使用的前端项目的路径 |
|
||||
|
||||
有关创建模板的更多详细信息，请参阅[模板指南](/docs/guides/templates)。
|
||||
|
||||
## 更新
|
||||
|
||||
`wails update` 将更新 Wails CLI 的版本。
|
||||
|
||||
| 标志 | 描述 |
|
||||
| :----------------- | :--------------------- |
|
||||
| -pre | 更新到最新的预发布版本 |
|
||||
| -version "version" | 安装指定版本的 CLI |
|
||||
|
||||
## 版本
|
||||
|
||||
`wails version` 将简单地输出当前的 CLI 版本。
|
||||
@@ -0,0 +1,227 @@
|
||||
---
|
||||
sidebar_position: 4
|
||||
---
|
||||
|
||||
# 应用菜单
|
||||
|
||||
可以通过定义[菜单](#菜单)结构类型并调用运行时方法[设置应用程序菜单](/docs/reference/runtime/menu#设置应用程序菜单)向 Wails 项目添加应用程序菜单。
|
||||
|
||||
也可以通过更新菜单结构并调用[更新应用程序菜单](/docs/reference/runtime/menu#更新应用程序菜单)来动态更新菜单 。
|
||||
|
||||
示例:
|
||||
|
||||
```go
|
||||
myMenu := menu.NewMenuFromItems(
|
||||
menu.SubMenu("File", menu.NewMenuFromItems(
|
||||
menu.Text("&Open", keys.CmdOrCtrl("o"), openFile),
|
||||
menu.Separator(),
|
||||
menu.Text("Quit", keys.CmdOrCtrl("q"), func(_ *menu.CallbackData) {
|
||||
runtime.Quit()
|
||||
}),
|
||||
)),
|
||||
)
|
||||
|
||||
runtime.MenuSetApplicationMenu(myMenu)
|
||||
|
||||
```
|
||||
|
||||
上面的示例使用快捷方法，但是可以手动构建菜单结构。
|
||||
|
||||
## 菜单
|
||||
|
||||
菜单是菜单项的集合：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
type Menu struct {
|
||||
Items []*MenuItem
|
||||
}
|
||||
```
|
||||
|
||||
对于应用程序菜单，每个菜单项代表一个菜单，例如“编辑”。
|
||||
|
||||
提供了一个简单的快捷方法来构建菜单：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
func NewMenuFromItems(first *MenuItem, rest ...*MenuItem) *Menu
|
||||
```
|
||||
|
||||
这使得代码的布局更像是菜单的布局，而无需在创建菜单项后手动添加它们。或者，您可以只创建菜单项并手动将它们添加到菜单中。
|
||||
|
||||
## 菜单项
|
||||
|
||||
菜单项表示菜单中的一个项目。
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
// MenuItem represents a menu item contained in a menu
|
||||
type MenuItem struct {
|
||||
Label string
|
||||
Role Role
|
||||
Accelerator *keys.Accelerator
|
||||
Type Type
|
||||
Disabled bool
|
||||
Hidden bool
|
||||
Checked bool
|
||||
SubMenu *Menu
|
||||
Click Callback
|
||||
}
|
||||
```
|
||||
|
||||
| 字段 | 类型 | 笔记 |
|
||||
| ----------- | ----------------------------- | ----------------------------------- |
|
||||
| Label | string | 菜单文字 |
|
||||
| Accelerator | [\*keys.Accelerator](#加速器) | 此菜单项的键绑定 |
|
||||
| Type | [Type](#类型) | 菜单项的类型 |
|
||||
| Disabled | bool | 禁用菜单项 |
|
||||
| Hidden | bool | 隐藏此菜单项 |
|
||||
| Checked | bool | 向菜单项设置选中 (复选框和单选类型) |
|
||||
| SubMenu | [\*Menu](#菜单) | 设置子菜单 |
|
||||
| Click | [Callback](#回调) | 单击菜单时的回调函数 |
|
||||
|
||||
### 加速器
|
||||
|
||||
加速器（有时称为键盘快捷键）定义了按键和菜单项之间的绑定。 Wails 将加速器定义为一个组合或键 + [修饰符](#修饰符)。
|
||||
它们在`"github.com/wailsapp/wails/v2/pkg/menu/keys"`包中可用。
|
||||
|
||||
示例:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
// Defines cmd+o on Mac and ctrl-o on Window/Linux
|
||||
myShortcut := keys.CmdOrCtrl("o")
|
||||
```
|
||||
|
||||
键是键盘上除了`+`的任何字符，它被定义为`加号`。有些键不能表示为字符，因此可以使用一组命名字符：
|
||||
|
||||
- `backspace`
|
||||
- `tab`
|
||||
- `return`
|
||||
- `enter`
|
||||
- `escape`
|
||||
- `left`
|
||||
- `right`
|
||||
- `up`
|
||||
- `down`
|
||||
- `space`
|
||||
- `delete`
|
||||
- `home`
|
||||
- `end`
|
||||
- `page up`
|
||||
- `page down`
|
||||
- `f1`
|
||||
- `f2`
|
||||
- `f3`
|
||||
- `f4`
|
||||
- `f5`
|
||||
- `f6`
|
||||
- `f7`
|
||||
- `f8`
|
||||
- `f9`
|
||||
- `f10`
|
||||
- `f11`
|
||||
- `f12`
|
||||
- `f13`
|
||||
- `f14`
|
||||
- `f15`
|
||||
- `f16`
|
||||
- `f17`
|
||||
- `f18`
|
||||
- `f19`
|
||||
- `f20`
|
||||
- `f21`
|
||||
- `f22`
|
||||
- `f23`
|
||||
- `f24`
|
||||
- `f25`
|
||||
- `f26`
|
||||
- `f27`
|
||||
- `f28`
|
||||
- `f29`
|
||||
- `f30`
|
||||
- `f31`
|
||||
- `f32`
|
||||
- `f33`
|
||||
- `f34`
|
||||
- `f35`
|
||||
- `numlock`
|
||||
|
||||
Wails 还支持使用与 Electron 相同的语法来解析加速器。 这对于在配置文件中存储加速器很有用。
|
||||
|
||||
示例:
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
// Defines cmd+o on Mac and ctrl-o on Window/Linux
|
||||
myShortcut, err := keys.Parse("Ctrl+Option+A")
|
||||
```
|
||||
|
||||
#### 修饰符
|
||||
|
||||
以下修饰符是可以与加速键组合使用的键：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
const (
|
||||
// CmdOrCtrlKey represents Command on Mac and Control on other platforms
|
||||
CmdOrCtrlKey Modifier = "cmdorctrl"
|
||||
// OptionOrAltKey represents Option on Mac and Alt on other platforms
|
||||
OptionOrAltKey Modifier = "optionoralt"
|
||||
// ShiftKey represents the shift key on all systems
|
||||
ShiftKey Modifier = "shift"
|
||||
// ControlKey represents the control key on all systems
|
||||
ControlKey Modifier = "ctrl"
|
||||
)
|
||||
```
|
||||
|
||||
许多快捷方法可用于使用修饰符创建加速器：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
func CmdOrCtrl(key string) *Accelerator
|
||||
func OptionOrAlt(key string) *Accelerator
|
||||
func Shift(key string) *Accelerator
|
||||
func Control(key string) *Accelerator
|
||||
```
|
||||
|
||||
修饰符可以结合`keys.Combo(key string, modifier1 Modifier, modifier2 Modifier, rest ...Modifier)`使用：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu/keys"
|
||||
// Defines "Ctrl+Option+A" on Mac and "Ctrl+Alt+A" on Window/Linux
|
||||
myShortcut := keys.Combo("a", ControlKey, OptionOrAltKey)
|
||||
```
|
||||
|
||||
### 类型
|
||||
|
||||
每个菜单项必须有一个类型，有 5 种类型可用：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
const (
|
||||
TextType Type = "Text"
|
||||
SeparatorType Type = "Separator"
|
||||
SubmenuType Type = "Submenu"
|
||||
CheckboxType Type = "Checkbox"
|
||||
RadioType Type = "Radio"
|
||||
)
|
||||
```
|
||||
|
||||
为方便起见，提供了快捷方法来快速创建菜单项：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
func Text(label string, accelerator *keys.Accelerator, click Callback) *MenuItem
|
||||
func Separator() *MenuItem
|
||||
func Radio(label string, selected bool, accelerator *keys.Accelerator, click Callback) *MenuItem
|
||||
func Checkbox(label string, checked bool, accelerator *keys.Accelerator, click Callback) *MenuItem
|
||||
func SubMenu(label string, menu *Menu) *MenuItem
|
||||
```
|
||||
|
||||
关于单选菜单组的说明:单选菜单组定义为菜单中相邻的多个单选菜单项。这意味着您不需要将项目分组在一起，因为它是自动的。
|
||||
然而，这也意味着你不能有两个相邻的单选菜单组-它们之间必须有一个非单选菜单项。
|
||||
|
||||
### 回调
|
||||
|
||||
每个菜单项都可能有一个回调，在单击该项时会执行该回调：
|
||||
|
||||
```go title="Package: github.com/wailsapp/wails/v2/pkg/menu"
|
||||
type Callback func(*CallbackData)
|
||||
|
||||
type CallbackData struct {
|
||||
MenuItem *MenuItem
|
||||
}
|
||||
```
|
||||
|
||||
给函数一个`CallbackData`结构体，它指示哪个菜单项触发了回调。这在使用可能共享回调的单选菜单组时很有用。
|
||||
@@ -0,0 +1,254 @@
|
||||
---
|
||||
title: 参数选项
|
||||
sidebar_position: 3
|
||||
---
|
||||
|
||||
# 参数选项
|
||||
|
||||
## 应用程序参数选项
|
||||
|
||||
该`Options.App`结构包含应用程序配置。它被传递给`wails.Run()`方法：
|
||||
|
||||
```go title="Example"
|
||||
import "github.com/wailsapp/wails/v2/pkg/options"
|
||||
|
||||
func main() {
|
||||
|
||||
err := wails.Run(&options.App{
|
||||
Title: "Menus Demo",
|
||||
Width: 800,
|
||||
Height: 600,
|
||||
DisableResize: false,
|
||||
Fullscreen: false,
|
||||
Frameless: true,
|
||||
MinWidth: 400,
|
||||
MinHeight: 400,
|
||||
MaxWidth: 1280,
|
||||
MaxHeight: 1024,
|
||||
StartHidden: false,
|
||||
HideWindowOnClose: false,
|
||||
RGBA: &options.RGBA{R: 0, G: 0, B: 0, A: 255},
|
||||
Assets: assets,
|
||||
Menu: app.applicationMenu(),
|
||||
Logger: nil,
|
||||
LogLevel: logger.DEBUG,
|
||||
OnStartup: app.startup,
|
||||
OnDomReady: app.domready,
|
||||
OnShutdown: app.shutdown,
|
||||
Bind: []interface{}{
|
||||
app,
|
||||
},
|
||||
Windows: &windows.Options{
|
||||
WebviewIsTransparent: false,
|
||||
WindowIsTranslucent: false,
|
||||
DisableWindowIcon: false,
|
||||
},
|
||||
})
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
### 标题
|
||||
|
||||
名称：Title
|
||||
|
||||
类型：string
|
||||
|
||||
窗口标题栏中显示的文本。
|
||||
|
||||
### 宽度
|
||||
|
||||
名称：Width
|
||||
|
||||
类型：int
|
||||
|
||||
窗口的初始宽度。默认值：1024。
|
||||
|
||||
### 高度
|
||||
|
||||
名称：Height
|
||||
|
||||
类型：int
|
||||
|
||||
窗口的初始高度。默认值：768
|
||||
|
||||
### 禁用调整窗口尺寸
|
||||
|
||||
名称：DisableResize
|
||||
|
||||
类型：bool
|
||||
|
||||
默认情况下，主窗口可调整大小。将此设置为 true 将使其保持固定大小。
|
||||
|
||||
### 全屏
|
||||
|
||||
名称：Fullscreen
|
||||
|
||||
类型：bool
|
||||
|
||||
将此设置为 true 将在启动时使窗口全屏。
|
||||
|
||||
### 无边框
|
||||
|
||||
名称：Frameless
|
||||
|
||||
类型：bool
|
||||
|
||||
设置为 时 true，窗口将没有边框或标题栏。另请参阅[无边框窗口](/docs/guides/frameless)。
|
||||
|
||||
### 最小宽度
|
||||
|
||||
名称：MinWidth
|
||||
|
||||
类型：int
|
||||
|
||||
这将设置窗口的最小宽度。如果给出的值`Width`小于这个值，窗口将被设置为`MinWidth`默认值。
|
||||
|
||||
### 最小高度
|
||||
|
||||
名称：MinHeight
|
||||
|
||||
类型：int
|
||||
|
||||
这将设置窗口的最小高度。如果给出的值`Height`小于这个值，窗口将被设置为`MinHeight`默认值。
|
||||
|
||||
### 最大宽度
|
||||
|
||||
名称：MaxWidth
|
||||
|
||||
类型：int
|
||||
|
||||
这将设置窗口的最大宽度。如果给出的值`Width`大于这个值，窗口将被设置为`MaxWidth`默认值。
|
||||
|
||||
### 最大高度
|
||||
|
||||
名称：MaxHeight
|
||||
|
||||
类型：int
|
||||
|
||||
这将设置窗口的最大高度。如果给出的值`Height`大于这个值，窗口将被设置为`MaxHeight`默认值。
|
||||
|
||||
### 启动时隐藏窗口
|
||||
|
||||
名称：StartHidden
|
||||
|
||||
类型：bool
|
||||
|
||||
设置为 时`true`，应用程序将被隐藏，直到调用[显示窗口](/docs/reference/runtime/window#显示窗口)。
|
||||
|
||||
### 关闭时隐藏窗口
|
||||
|
||||
名称：HideWindowOnClose
|
||||
|
||||
类型：bool
|
||||
|
||||
默认情况下，关闭窗口将关闭应用程序。将此设置为`true`意味着关闭窗口将隐藏窗口。
|
||||
|
||||
### RGBA
|
||||
|
||||
名称：RGBA
|
||||
|
||||
类型：int (0xRRGGBBAA) 示例：0xFF000088 - 透明度为 50% 的红色
|
||||
|
||||
该值是默认设置窗口的 RGBA 值。默认值：0xFFFFFFFF。
|
||||
|
||||
### 资源
|
||||
|
||||
名称：Assets
|
||||
|
||||
类型：\*embed.FS
|
||||
|
||||
应用程序要使用的前端资源。需要一个`index.html`文件。
|
||||
|
||||
### 菜单
|
||||
|
||||
名称：Menu
|
||||
|
||||
类型：\*menu.Menu
|
||||
|
||||
应用程序要使用的菜单。[菜单参考](/docs/reference/runtime/menu)中有关菜单的更多详细信息。
|
||||
|
||||
### 日志
|
||||
|
||||
名称：Logger
|
||||
|
||||
类型：logger.Logger 默认值：Logger to Stdout
|
||||
|
||||
应用程序要使用的记录器。有关日志记录的更多详细信息，请参阅[日志参考](/docs/reference/runtime/log)。
|
||||
|
||||
### 日志级别
|
||||
|
||||
名称：LogLevel
|
||||
|
||||
类型：logger.LogLevel 默认值：Info 在开发模式下，Error 在生产模式下
|
||||
|
||||
默认日志级别。有关日志记录的更多详细信息，请参阅[设置日志等级](/docs/reference/runtime/log#设置日志等级)。
|
||||
|
||||
### 应用启动回调
|
||||
|
||||
名称：OnStartup
|
||||
|
||||
类型：func(ctx context.Context)
|
||||
|
||||
此回调在前端创建之后调用，但在`index.html`加载之前调用。它给出了应用程序上下文。
|
||||
|
||||
### 前端 Dom 加载完成回调
|
||||
|
||||
名称：OnDomReady
|
||||
|
||||
类型：func(ctx context.Context)
|
||||
|
||||
在前端加载`index.html`完毕并且 DOM 准备就绪后调用此回调。它给出了应用程序上下文。
|
||||
|
||||
### 应用退出回调
|
||||
|
||||
名称：OnShutdown
|
||||
|
||||
类型：func(ctx context.Context)
|
||||
|
||||
在前端被销毁之后，就在应用程序终止之前，调用此回调。它给出了应用程序上下文。
|
||||
|
||||
### 绑定
|
||||
|
||||
名称：Bind
|
||||
|
||||
类型： []interface{}
|
||||
|
||||
定义需要绑定到前端的方法的一部分结构实例。
|
||||
|
||||
### 窗口
|
||||
|
||||
名称：Windows
|
||||
|
||||
类型：\*windows.Options
|
||||
|
||||
这定义了[Windows 特定的选项](#windows-特定选项).。
|
||||
|
||||
## Windows 特定选项
|
||||
|
||||
### 网页透明
|
||||
|
||||
名称：WebviewIsTransparent
|
||||
|
||||
类型：bool
|
||||
|
||||
将此设置为 true 将使 webview 背景透明，其中没有其他颜色呈现。通常与[窗口半透明](#窗口半透明)结合使用 以制作外观现代的应用程序。
|
||||
|
||||
### 窗口半透明
|
||||
|
||||
名称：WindowIsTranslucent
|
||||
|
||||
类型：bool
|
||||
|
||||
将此设置为 true 将使窗口半透明。通常与[网页透明](#网页透明) 结合使用以制作外观现代的应用程序。
|
||||
|
||||
### 禁用窗口图标
|
||||
|
||||
名称：DisableWindowIcon
|
||||
|
||||
类型：bool
|
||||
|
||||
将此设置为 true 将删除标题栏左上角的图标。
|
||||
@@ -0,0 +1,23 @@
|
||||
---
|
||||
sidebar_position: 5
|
||||
---
|
||||
|
||||
# 项目配置
|
||||
|
||||
项目配置在项目目录中的`wails.json`文件中。配置的结构是：
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "[项目名称]",
|
||||
"assetdir": "[资源目录的相对路径]",
|
||||
"frontend:install": "[安装node依赖的命令，在frontend目录下运行 - 通常是 `npm install`]",
|
||||
"frontend:build": "[构建资源的命令，在frontend目录下运行 - 通常是 `npm run build`]",
|
||||
"wailsjsdir": "[自动生成的JS模块将被创建的目录的相对路径]",
|
||||
"version": "[项目配置版本]",
|
||||
"outputfilename": "[二进制文件的名称]"
|
||||
}
|
||||
```
|
||||
|
||||
该文件将在运行`wails build`或`wails dev`时，由 Wails CLI 读取。
|
||||
|
||||
`wails build/dev`命令中的`assetdir`和`wailsjsdir`标志将覆盖项目配置并作为后续运行的默认值。
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"label": "Runtime",
|
||||
"position": 1
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
---
|
||||
sidebar_position: 7
|
||||
---
|
||||
|
||||
# 浏览器
|
||||
|
||||
## 概述
|
||||
|
||||
这些方法与系统浏览器相关。
|
||||
|
||||
### 浏览器打开 URL
|
||||
|
||||
Go 方法签名: `BrowserOpenURL(ctx context.Context, url string)`
|
||||
|
||||
JS 方法签名: `BrowserOpenURL(url string)`
|
||||
|
||||
使用系统默认浏览器打开给定的 URL。
|
||||
@@ -0,0 +1,140 @@
|
||||
---
|
||||
title: 对话框
|
||||
sidebar_position: 5
|
||||
---
|
||||
|
||||
# 对话框
|
||||
|
||||
## 概述
|
||||
|
||||
运行时的这一部分提供对原生对话框的调用，例如文件选择器和消息框。上下文
|
||||
|
||||
:::info Javascript
|
||||
JS 运行时当前不支持 Dialog。
|
||||
:::
|
||||
|
||||
### 打开选择目录对话框
|
||||
|
||||
Go 方法签名: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)`
|
||||
|
||||
返回值: 所选目录（如果用户取消则为空白）或错误
|
||||
|
||||
打开一个对话框，提示用户选择目录。可以使用 [打开选择文件对话框参数选项](#打开选择文件对话框参数选项)进行自定义。
|
||||
|
||||
### 打开选择文件对话框
|
||||
|
||||
Go 方法签名: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)`
|
||||
|
||||
返回值: 所选文件（如果用户取消则为空白）或错误
|
||||
|
||||
打开一个对话框，提示用户选择文件。可以使用[打开选择文件对话框参数选项](#打开选择文件对话框参数选项)进行自定义。
|
||||
|
||||
### 打开选择多个文件对话框
|
||||
|
||||
Go 方法签名: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)`
|
||||
|
||||
返回值: 选定的文件（如果用户取消则为零）或错误
|
||||
|
||||
打开一个对话框，提示用户选择多个文件。可以使用[打开选择文件对话框参数选项](#打开选择文件对话框参数选项)进行自定义。
|
||||
|
||||
### 保存文件对话框
|
||||
|
||||
Go 方法签名: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)`
|
||||
|
||||
返回值: 所选文件（如果用户取消则为空白）或错误
|
||||
|
||||
打开一个对话框，提示用户选择文件名以进行保存。可以使用[保存文件对话框参数选项](#保存文件对话框参数选项)自定义。
|
||||
|
||||
### 消息对话框
|
||||
|
||||
Go 方法签名: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)`
|
||||
|
||||
返回值: 所选按钮的文本或错误
|
||||
|
||||
使用消息对话框显示消息。可以使用[消息对话框参数选项](#消息对话框参数选项)进行自定义。
|
||||
|
||||
## 参数选项
|
||||
|
||||
### 打开选择文件对话框参数选项
|
||||
|
||||
```go
|
||||
type OpenDialogOptions struct {
|
||||
DefaultDirectory string
|
||||
DefaultFilename string
|
||||
Title string
|
||||
Filters []FileFilter
|
||||
AllowFiles bool // Mac Only
|
||||
AllowDirectories bool // Mac Only
|
||||
ShowHiddenFiles bool // Mac Only
|
||||
CanCreateDirectories bool // Mac Only
|
||||
ResolvesAliases bool // Mac Only
|
||||
TreatPackagesAsDirectories bool // Mac Only
|
||||
}
|
||||
```
|
||||
|
||||
### 保存文件对话框参数选项
|
||||
|
||||
```go
|
||||
type SaveDialogOptions struct {
|
||||
DefaultDirectory string
|
||||
DefaultFilename string
|
||||
Title string
|
||||
Filters []FileFilter
|
||||
ShowHiddenFiles bool // Mac Only
|
||||
CanCreateDirectories bool // Mac Only
|
||||
TreatPackagesAsDirectories bool // Mac Only
|
||||
}
|
||||
```
|
||||
|
||||
### 消息对话框参数选项
|
||||
|
||||
```go
|
||||
type MessageDialogOptions struct {
|
||||
Type DialogType
|
||||
Title string
|
||||
Message string
|
||||
Buttons []string
|
||||
DefaultButton string // Mac Only
|
||||
CancelButton string // Mac Only
|
||||
Icon string // Mac Only
|
||||
}
|
||||
```
|
||||
|
||||
import Tabs from "@theme/Tabs";
|
||||
import TabItem from "@theme/TabItem";
|
||||
|
||||
<Tabs
|
||||
defaultValue="Windows"
|
||||
values={[
|
||||
{ label: "Windows", value: "Windows" },
|
||||
{ label: "MacOS", value: "MacOS" },
|
||||
{ label: "Linux", value: "Linux" },
|
||||
]}
|
||||
>
|
||||
<TabItem value="Windows">
|
||||
Windows
|
||||
具有标准对话框类型并且按钮不可定制。返回的值将是以下之一：“确定”、“取消”、“中止”、“重试”、“忽略”、“是”、“否”、“再试一次”或“继续”
|
||||
</TabItem>
|
||||
<TabItem value="MacOS">“DefaultButton”和“CancelButton”都应与“Buttons”中的值匹配。</TabItem>
|
||||
<TabItem value="Linux">即将推出...</TabItem>
|
||||
</Tabs>
|
||||
|
||||
#### 对话框类型
|
||||
|
||||
```go
|
||||
const (
|
||||
InfoDialog DialogType = "info"
|
||||
WarningDialog DialogType = "warning"
|
||||
ErrorDialog DialogType = "error"
|
||||
QuestionDialog DialogType = "question"
|
||||
)
|
||||
```
|
||||
|
||||
### 文件过滤
|
||||
|
||||
```go
|
||||
type FileFilter struct {
|
||||
DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)"
|
||||
Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png"
|
||||
}
|
||||
```
|
||||
@@ -0,0 +1,50 @@
|
||||
---
|
||||
title: 事件
|
||||
sidebar_position: 2
|
||||
---
|
||||
|
||||
# 事件
|
||||
|
||||
## 概述
|
||||
|
||||
Wails 运行时提供了一个统一的事件系统，其中事件可以由 Go 或 Javascript 发出或接收。可选地，数据可以与事件一起传递。侦听器将接收本地数据类型中的数据。
|
||||
|
||||
### 添加事件侦听器
|
||||
|
||||
Go 方法签名: `EventsOn(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
|
||||
|
||||
JS 方法签名: `EventsOn(eventName string, callback function(optionalData?: any))`
|
||||
|
||||
此方法为给定的事件名称设置一个侦听器。当一个`eventName`类型的事件被[触发指定事件](#触发指定事件)时，回调被触发。与触发事件一起发送的任何其他数据都将传递给回调。
|
||||
|
||||
### 移除事件侦听器
|
||||
|
||||
Go 方法签名: `EventsOff(ctx context.Context, eventName string)`
|
||||
|
||||
JS 方法签名: `EventsOff(eventName string)`
|
||||
|
||||
此方法取消注册给定事件名称的侦听器。
|
||||
|
||||
### 添加只触发一次的事件侦听器
|
||||
|
||||
Go 方法签名: `EventsOnce(ctx context.Context, eventName string, callback func(optionalData ...interface{}))`
|
||||
|
||||
JS 方法签名: `EventsOnce(eventName string, callback function(optionalData?: any))`
|
||||
|
||||
此方法为给定的事件名称设置一个侦听器，但只会触发一次。
|
||||
|
||||
### 添加指定对多触发次数的事件侦听器
|
||||
|
||||
Go 方法签名: `EventsOnMultiple(ctx context.Context, eventName string, callback func(optionalData ...interface{}), counter int)`
|
||||
|
||||
JS 方法签名: `EventsOnMultiple(eventName string, callback function(optionalData?: any), counter int)`
|
||||
|
||||
此方法为给定的事件名称设置一个侦听器，但最多只能触发`counter`次。
|
||||
|
||||
### 触发指定事件
|
||||
|
||||
Go 方法签名: `Events(ctx context.Context, eventName string, optionalData ...interface{})`
|
||||
|
||||
JS 方法签名: `Events(ctx context, optionalData function(optionalData?: any))`
|
||||
|
||||
此方法触发指定的事件。可选数据可以与事件一起传递。这将触发任何事件侦听器。
|
||||
@@ -0,0 +1,12 @@
|
||||
---
|
||||
title: 介绍
|
||||
sidebar_position: 1
|
||||
---
|
||||
|
||||
# 介绍
|
||||
|
||||
运行时是一个为应用程序提供实用方法的库。有 Go 和 Javascript 运行时，目的是在可能的情况下尝试使它们保持一致。
|
||||
|
||||
Go 运行时可通过导入`github.com/wailsapp/wails/v2/pkg/runtime`. 此包中的所有方法都将 context 作为第一个参数。这个 context 可以从[应用启动回调](/docs/reference/options#应用启动回调) 或[前端 Dom 加载完成回调](/docs/reference/options#前端-dom-加载完成回调)回调中获得。
|
||||
|
||||
Javascript 库可通过`window.runtime`提供给前端。使用 dev 模式时会生成一个运行时包，该包为运行时提供 Typescript 声明。这应该位于你的前端目录中的`wailsjs`目录中。
|
||||
@@ -0,0 +1,107 @@
|
||||
---
|
||||
title: 日志
|
||||
sidebar_position: 3
|
||||
---
|
||||
|
||||
# 日志
|
||||
|
||||
## 概述
|
||||
|
||||
Wails 运行时提供了一种可以从 Go 或 Javascript 调用的日志记录机制。像大多数记录器一样，有许多日志级别：
|
||||
|
||||
- Trace
|
||||
- Debug
|
||||
- Info
|
||||
- Warning
|
||||
- Error
|
||||
- Fatal
|
||||
|
||||
记录器将输出当前或更高日志级别的任何日志消息。示例：`Debug`日志级别将输出除`Trace`消息之外的所有消息。
|
||||
|
||||
### 打印日志
|
||||
|
||||
Go 方法签名: `LogPrint(ctx context.Context, message string)`
|
||||
|
||||
JS 方法签名: `LogPrint(message: string)`
|
||||
|
||||
将给定的消息记录为原始消息。
|
||||
|
||||
### Trace 日志
|
||||
|
||||
Go 方法签名: `LogTrace(ctx context.Context, message string)`
|
||||
|
||||
JS 方法签名: `LogTrace(message: string)`
|
||||
|
||||
在`Trace`日志级别记录给定的消息。
|
||||
|
||||
### Debug 日志
|
||||
|
||||
Go 方法签名: `LogDebug(ctx context.Context, message string)`
|
||||
|
||||
JS 方法签名: `LogDebug(message: string)`
|
||||
|
||||
在`Debug`日志级别记录给定的消息。
|
||||
|
||||
### Info 日志
|
||||
|
||||
Go 方法签名: `LogInfo(ctx context.Context, message string)`
|
||||
|
||||
JS 方法签名: `LogInfo(message: string)`
|
||||
|
||||
在`Info`日志级别记录给定的消息。
|
||||
|
||||
### Warning 日志
|
||||
|
||||
Go 方法签名: `LogWarning(ctx context.Context, message string)`
|
||||
|
||||
JS 方法签名: `LogWarning(message: string)`
|
||||
|
||||
在`Warning`日志级别记录给定的消息。
|
||||
|
||||
### Error 日志
|
||||
|
||||
Go 方法签名: `LogError(ctx context.Context, message string)`
|
||||
|
||||
JS 方法签名: `LogError(message: string)`
|
||||
|
||||
在`Error`日志级别记录给定的消息。
|
||||
|
||||
### Fatal 日志
|
||||
|
||||
Go 方法签名: `LogFatal(ctx context.Context, message string)`
|
||||
|
||||
JS 方法签名: `LogFatal(message: string)`
|
||||
|
||||
在`Fatal`日志级别记录给定的消息。
|
||||
|
||||
### 设置日志级别
|
||||
|
||||
Go 方法签名: `LogSetLogLevel(ctx context.Context, level logger.LogLevel)`
|
||||
|
||||
JS 方法签名: `LogSetLogLevel(level: number)`
|
||||
|
||||
设置日志级别。在 Javascript 中，该数字与以下日志级别有关：
|
||||
|
||||
| 值 | 日志等级 |
|
||||
| --- | -------- |
|
||||
| 1 | Trace |
|
||||
| 2 | Debug |
|
||||
| 3 | Info |
|
||||
| 4 | Warning |
|
||||
| 5 | Error |
|
||||
|
||||
## 使用自定义日志
|
||||
|
||||
可以通过使用应用程序参数选项 [日志](/docs/reference/options#日志) 提供自定义记录器来使用它。唯一的要求是记录器实现了在`github.com/wailsapp/wails/v2/pkg/logger`里`logger.Logger`定义的接口：
|
||||
|
||||
```go title="logger.go"
|
||||
type Logger interface {
|
||||
Print(message string)
|
||||
Trace(message string)
|
||||
Debug(message string)
|
||||
Info(message string)
|
||||
Warning(message string)
|
||||
Error(message string)
|
||||
Fatal(message string)
|
||||
}
|
||||
```
|
||||
@@ -0,0 +1,28 @@
|
||||
---
|
||||
title: 菜单
|
||||
sidebar_position: 6
|
||||
---
|
||||
|
||||
# 菜单
|
||||
|
||||
## 概述
|
||||
|
||||
这些方法与应用程序菜单相关。
|
||||
|
||||
:::info Javascript
|
||||
|
||||
JS 运行时当前不支持菜单。
|
||||
|
||||
:::
|
||||
|
||||
### 设置应用程序菜单
|
||||
|
||||
Go 方法签名: `MenuSetApplicationMenu(ctx context.Context, menu *menu.Menu)`
|
||||
|
||||
将应用程序菜单设置为给定的[应用菜单](/docs/reference/menus)。
|
||||
|
||||
### 更新应用程序菜单
|
||||
|
||||
Go 方法签名: `MenuUpdateApplicationMenu(ctx context.Context)`
|
||||
|
||||
更新应用程序菜单，选取对传递给`MenuSetApplicationMenu`的菜单所做的任何更改。
|
||||
@@ -0,0 +1,197 @@
|
||||
---
|
||||
title: 窗口
|
||||
sidebar_position: 4
|
||||
---
|
||||
|
||||
# 窗口
|
||||
|
||||
## 概述
|
||||
|
||||
这些方法可以控制应用程序窗口。
|
||||
|
||||
### 窗口标题
|
||||
|
||||
Go 方法签名: `WindowSetTitle(ctx context.Context, title string)`
|
||||
|
||||
JS 方法签名: `WindowSetTitle(title: string)`
|
||||
|
||||
设置窗口标题栏中的文本。
|
||||
|
||||
### 窗口全屏
|
||||
|
||||
Go 方法签名: `WindowFullscreen(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowFullscreen()`
|
||||
|
||||
使窗口全屏。
|
||||
|
||||
### 窗口取消全屏
|
||||
|
||||
Go 方法签名: `WindowUnFullscreen(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowUnFullscreen()`
|
||||
|
||||
在全屏之前恢复先前的窗口尺寸和位置。
|
||||
|
||||
### 窗口居中
|
||||
|
||||
Go 方法签名: `WindowCenter(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowCenter()`
|
||||
|
||||
使窗口在当前窗口所在的监视器上居中。
|
||||
|
||||
### 窗口重新加载
|
||||
|
||||
Go 方法签名: `WindowReload(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowReload()`
|
||||
|
||||
执行“重新加载”（重新加载 index.html）
|
||||
|
||||
### 显示窗口
|
||||
|
||||
Go 方法签名: `WindowShow(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowShow()`
|
||||
|
||||
如果窗口当前处于隐藏状态，则显示该窗口。
|
||||
|
||||
### 隐藏窗口
|
||||
|
||||
Go 方法签名: `WindowHide(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowHide()`
|
||||
|
||||
隐藏窗口（如果当前可见）。
|
||||
|
||||
### 设置窗口尺寸
|
||||
|
||||
Go 方法签名: `WindowSetSize(ctx context.Context, width int, height int)`
|
||||
|
||||
JS 方法签名: `WindowSetSize(size: Size)`
|
||||
|
||||
设置窗口的宽度和高度。
|
||||
|
||||
### 获取窗口尺寸
|
||||
|
||||
Go 方法签名: `WindowGetSize(ctx context.Context) (width int, height int)`
|
||||
|
||||
JS 方法签名: `WindowGetSize() : Size`
|
||||
|
||||
获取窗口的宽度和高度。
|
||||
|
||||
### 设置窗口最小尺寸
|
||||
|
||||
Go 方法签名: `WindowSetMinSize(ctx context.Context, width int, height int)`
|
||||
|
||||
JS 方法签名: `WindowSetMinSize(size: Size)`
|
||||
|
||||
设置最小窗口大小。如果窗口当前小于给定尺寸，将调整窗口大小。
|
||||
|
||||
将大小设置为 `0,0` 将禁用此约束。
|
||||
|
||||
### 设置窗口最大尺寸
|
||||
|
||||
Go 方法签名: `WindowSetMaxSize(ctx context.Context, width int, height int)`
|
||||
|
||||
JS 方法签名: `WindowSetMaxSize(size: Size)`
|
||||
|
||||
设置最大窗口大小。如果窗口当前大于给定尺寸，将调整窗口大小。
|
||||
|
||||
将大小设置为 `0,0` 将禁用此约束。
|
||||
|
||||
### 设置窗口位置
|
||||
|
||||
Go 方法签名: `WindowSetPosition(ctx context.Context, x int, y int)`
|
||||
|
||||
JS 方法签名: `WindowSetPosition(position: Position)`
|
||||
|
||||
设置相对于窗口当前所在监视器的窗口位置。
|
||||
|
||||
### 获取窗口位置
|
||||
|
||||
Go 方法签名: `WindowGetPosition(ctx context.Context) (x int, y int)`
|
||||
|
||||
JS 方法签名: `WindowGetPosition() : Position`
|
||||
|
||||
获取相对于窗口当前所在显示器的窗口位置。
|
||||
|
||||
### 窗口最大化
|
||||
|
||||
Go 方法签名: `WindowMaximise(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowMaximise()`
|
||||
|
||||
最大化窗口以填满屏幕。
|
||||
|
||||
### 窗口取消最大化
|
||||
|
||||
Go 方法签名: `WindowUnmaximise(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowUnmaximise()`
|
||||
|
||||
将窗口恢复到最大化之前的尺寸和位置。
|
||||
|
||||
### 窗口最小化
|
||||
|
||||
Go 方法签名: `WindowMinimise(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowMinimise()`
|
||||
|
||||
最小化窗口。
|
||||
|
||||
### 窗口取消最小化
|
||||
|
||||
Go 方法签名: `WindowUnminimise(ctx context.Context)`
|
||||
|
||||
JS 方法签名: `WindowUnminimise()`
|
||||
|
||||
将窗口恢复到最小化之前的尺寸和位置。
|
||||
|
||||
### 窗口设置 RGBA
|
||||
|
||||
Go 方法签名: `WindowSetRGBA(ctx context.Context, col *options.RGBA)`
|
||||
|
||||
JS 方法签名: `WindowSetRGBA(col: RGBA)`
|
||||
|
||||
将窗口的背景颜色设置为给定的[RGBA](window#颜色)颜色定义。此颜色将显示所有透明像素。
|
||||
|
||||
R、G、B 和 A 的有效值为 0-255。
|
||||
|
||||
:::info Windows
|
||||
|
||||
在 Windows 上，仅支持 0 或 255 的 alpha 值。任何不为 0 的值都将被视为 255。
|
||||
|
||||
:::
|
||||
|
||||
## Typescript 对象定义
|
||||
|
||||
### 位置
|
||||
|
||||
```ts
|
||||
interface Position {
|
||||
x: number;
|
||||
y: number;
|
||||
}
|
||||
```
|
||||
|
||||
### 尺寸
|
||||
|
||||
```ts
|
||||
interface Size {
|
||||
w: number;
|
||||
h: number;
|
||||
}
|
||||
```
|
||||
|
||||
### 颜色
|
||||
|
||||
```ts
|
||||
interface RGBA {
|
||||
r;
|
||||
g;
|
||||
b;
|
||||
a: number;
|
||||
}
|
||||
```
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
sidebar_position: 100
|
||||
---
|
||||
|
||||
# 网站统计
|
||||
Reference in New Issue
Block a user