mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-17 01:19:29 +08:00
324 lines
8.4 KiB
Markdown
324 lines
8.4 KiB
Markdown
# v3有哪些新功能？
|
||
|
||
!!! note v3版本中将包含的功能可能会有所更改。
|
||
|
||
## 多窗口
|
||
|
||
现在可以创建多个窗口，并对每个窗口进行独立配置。
|
||
|
||
```go
|
||
package main
|
||
|
||
import (
|
||
_ "embed"
|
||
"log"
|
||
|
||
"github.com/wailsapp/wails/v3/pkg/application"
|
||
)
|
||
|
||
//go:embed assets/*
|
||
var assets embed.FS
|
||
|
||
func main() {
|
||
|
||
app := application.New(application.Options{
|
||
Name: "多窗口演示",
|
||
Assets: application.AssetOptions{
|
||
Handler: application.AssetFileServerFS(assets),
|
||
},
|
||
})
|
||
|
||
window1 := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
|
||
Title: "窗口1",
|
||
})
|
||
|
||
window2 := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
|
||
Title: "窗口2",
|
||
})
|
||
|
||
// 从embed.FS加载嵌入的html
|
||
window1.SetURL("/")
|
||
window1.Center()
|
||
|
||
// 加载外部URL
|
||
window2.SetURL("https://wails.app")
|
||
|
||
err := app.Run()
|
||
|
||
if err != nil {
|
||
log.Fatal(err.Error())
|
||
}
|
||
}
|
||
|
||
```
|
||
|
||
## 系统托盘
|
||
|
||
系统托盘允许您在桌面的系统托盘区域添加一个图标，并具有以下功能：
|
||
|
||
- 附加窗口（窗口将居中于系统托盘图标）
|
||
- 完整的菜单支持
|
||
- 亮/暗模式图标
|
||
|
||
```go
|
||
package main
|
||
|
||
import (
|
||
_ "embed"
|
||
"log"
|
||
"runtime"
|
||
|
||
"github.com/wailsapp/wails/v3/pkg/application"
|
||
"github.com/wailsapp/wails/v3/pkg/icons"
|
||
)
|
||
|
||
func main() {
|
||
app := application.New(application.Options{
|
||
Name: "系统托盘演示",
|
||
Mac: application.MacOptions{
|
||
ActivationPolicy: application.ActivationPolicyAccessory,
|
||
},
|
||
})
|
||
|
||
window := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
|
||
Width: 500,
|
||
Height: 800,
|
||
Frameless: true,
|
||
AlwaysOnTop: true,
|
||
Hidden: true,
|
||
Windows: application.WindowsWindow{
|
||
HiddenOnTaskbar: true,
|
||
},
|
||
})
|
||
|
||
systemTray := app.NewSystemTray()
|
||
|
||
// macOS上的模板图标支持
|
||
if runtime.GOOS == "darwin" {
|
||
systemTray.SetTemplateIcon(icons.SystrayMacTemplate)
|
||
} else {
|
||
// 亮/暗模式图标支持
|
||
systemTray.SetDarkModeIcon(icons.SystrayDark)
|
||
systemTray.SetIcon(icons.SystrayLight)
|
||
}
|
||
|
||
// 菜单支持
|
||
myMenu := app.NewMenu()
|
||
myMenu.Add("Hello World!").OnClick(func(_ *application.Context) {
|
||
println("Hello World!")
|
||
})
|
||
systemTray.SetMenu(myMenu)
|
||
|
||
// 这将使窗口居中于系统托盘图标，偏移量为5px
|
||
// 单击系统托盘图标时，它将自动显示
|
||
// 当窗口失去焦点时隐藏
|
||
systemTray.AttachWindow(window).WindowOffset(5)
|
||
|
||
err := app.Run()
|
||
if err != nil {
|
||
log.Fatal(err)
|
||
}
|
||
}
|
||
|
||
```
|
||
|
||
## 插件
|
||
|
||
插件允许您扩展Wails系统的功能。不仅可以在Go中使用插件方法，还可以从Javascript中
|
||
调用插件方法。包含的插件有：
|
||
|
||
- kvstore - 键/值存储
|
||
- browser - 在浏览器中打开链接
|
||
- log - 自定义日志记录器
|
||
- oauth - 处理OAuth身份验证并支持60个提供商
|
||
- single_instance - 仅允许运行一个应用程序副本
|
||
- sqlite - 向应用程序添加SQLite数据库。使用现代纯Go库
|
||
- start_at_login - 注册/注销应用程序以在登录时启动
|
||
|
||
## 改进的绑定生成
|
||
|
||
v3使用新的静态分析器生成绑定。这使得生成绑定非常快速，并保留了绑定中的注释和参数
|
||
名称。默认情况下，绑定使用ID而不是字符串进行调用。这提供了性能提升，并允许使用混
|
||
淆工具，如[garble](https://github.com/burrowers/garble)。
|
||
|
||
通过在项目目录中运行 `wails3 generate bindings` 来生成绑定。
|
||
|
||
```js
|
||
// @ts-check
|
||
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
|
||
// This file is automatically generated. DO NOT EDIT
|
||
|
||
import { main } from "./models";
|
||
|
||
window.go = window.go || {};
|
||
window.go.main = {
|
||
GreetService: {
|
||
/**
|
||
* GreetService.Greet
|
||
* Greet greets a person
|
||
* @param name {string}
|
||
* @returns {Promise<string>}
|
||
**/
|
||
Greet: function (name) {
|
||
wails.CallByID(1411160069, ...Array.prototype.slice.call(arguments, 0));
|
||
},
|
||
|
||
/**
|
||
* GreetService.GreetPerson
|
||
* GreetPerson greets a person
|
||
* @param person {main.Person}
|
||
* @returns {Promise<string>}
|
||
**/
|
||
GreetPerson: function (person) {
|
||
wails.CallByID(4021313248, ...Array.prototype.slice.call(arguments, 0));
|
||
},
|
||
},
|
||
};
|
||
```
|
||
|
||
## 改进的构建系统
|
||
|
||
在v2中，构建系统完全不透明且难以自定义。在v3中，可以使用标准的Go工具构建所有内
|
||
容。
|
||
|
||
v2构建系统完成的所有繁重工作，例如图标生成，已作为CLI中的工具命令添加。我们
|
||
将[Taskfile](https://taskfile.dev)整合到CLI中，以协调这些调用，以带来与v2相同的
|
||
开发人员体验。然而，这种方法在灵活性和易用性之间达到了最佳平衡，因为现在您可以根
|
||
据需要自定义构建过程。
|
||
|
||
您甚至可以使用make，如果那是您的菜！
|
||
|
||
```yaml title="来自Taskfile.yml的片段"
|
||
build:darwin:
|
||
summary: 构建应用程序
|
||
platforms:
|
||
- darwin
|
||
cmds:
|
||
- task: pre-build
|
||
- task: build-frontend
|
||
- go build -gcflags=all="-N -l" -o bin/{{.APP_NAME}}
|
||
- task: post-build
|
||
env:
|
||
CGO_CFLAGS: "-mmacosx-version-min=10.13"
|
||
CGO_LDFLAGS: "-mmacosx-version-min=10.13"
|
||
MACOSX_DEPLOYMENT_TARGET: "10.13"
|
||
```
|
||
|
||
## 改进的事件
|
||
|
||
现在为许多运行时操作发出事件，允许您挂钩应用程序/系统事件。在存在常见平台事件的
|
||
地方，还发出了跨平台（通用）事件，允许您在跨平台上编写相同的事件处理方法。
|
||
|
||
还可以注册事件钩子。这些钩子类似于`On`方法，但是是同步的，并允许您取消事件。例
|
||
如，在关闭窗口之前显示确认对话框的示例。
|
||
|
||
```go
|
||
package main
|
||
|
||
import (
|
||
_ "embed"
|
||
"log"
|
||
"time"
|
||
|
||
"github.com/wailsapp/wails/v3/pkg/application"
|
||
"github.com/wailsapp/wails/v3/pkg/events"
|
||
)
|
||
|
||
//go:embed assets
|
||
var assets embed.FS
|
||
|
||
func main() {
|
||
|
||
app := application.New(application.Options{
|
||
Name: "Events Demo",
|
||
Description: "Events API演示",
|
||
Assets: application.AssetOptions{
|
||
Handler: application.AssetFileServerFS(assets),
|
||
},
|
||
Mac: application.MacOptions{
|
||
ApplicationShouldTerminateAfterLastWindowClosed: true,
|
||
},
|
||
})
|
||
|
||
// 自定义事件处理
|
||
app.Events.On("myevent", func(e *application.WailsEvent) {
|
||
log.Printf("[Go] 收到WailsEvent事件: %+v\n", e)
|
||
})
|
||
|
||
// 特定于操作系统的应用程序事件
|
||
app.On(events.Mac.ApplicationDidFinishLaunching, func(event *application.Event) {
|
||
println("events.Mac.ApplicationDidFinishLaunching触发！")
|
||
})
|
||
|
||
// 平台无关事件
|
||
app.On(events.Common.ApplicationStarted, func(event *application.Event) {
|
||
println("events.Common.ApplicationStarted触发！")
|
||
})
|
||
|
||
win1 := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
|
||
Title: "关闭我需要3次确认！",
|
||
})
|
||
|
||
var countdown = 3
|
||
|
||
// 注册钩子以取消窗口关闭
|
||
win1.RegisterHook(events.Common.WindowClosing, func(e *application.WindowEvent) {
|
||
countdown--
|
||
if countdown == 0 {
|
||
println("关闭！")
|
||
return
|
||
}
|
||
println("不行！不关闭！")
|
||
e.Cancel()
|
||
})
|
||
|
||
win1.On(events.Common.WindowFocus, func(e *application.WindowEvent) {
|
||
println("[事件] 窗口焦点！")
|
||
})
|
||
|
||
err := app.Run()
|
||
|
||
if err != nil {
|
||
log.Fatal(err.Error())
|
||
}
|
||
}
|
||
|
||
```
|
||
|
||
## Wails标记语言（wml）
|
||
|
||
一种实验性的功能，使用纯HTML调用运行时方法，类似于[htmx](https://htmx.org)。
|
||
|
||
```html
|
||
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<title>Wails ML演示</title>
|
||
</head>
|
||
<body style="margin-top:50px; color: white; background-color: #191919">
|
||
<h2>Wails ML演示</h2>
|
||
<p>此应用程序不包含任何Javascript！</p>
|
||
<button wml-event="button-pressed">按我！</button>
|
||
<button wml-event="delete-things" wml-confirm="确定吗？">
|
||
删除所有内容！
|
||
</button>
|
||
<button wml-window="Close" wml-confirm="确定吗？">关闭窗口？</button>
|
||
<button wml-window="Center">居中</button>
|
||
<button wml-window="Minimise">最小化</button>
|
||
<button wml-window="Maximise">最大化</button>
|
||
<button wml-window="UnMaximise">取消最大化</button>
|
||
<button wml-window="Fullscreen">全屏</button>
|
||
<button wml-window="UnFullscreen">取消全屏</button>
|
||
<button wml-window="Restore">还原</button>
|
||
<div
|
||
style="width: 200px; height: 200px; border: 2px solid white;"
|
||
wml-event="hover"
|
||
wml-trigger="mouseover"
|
||
>
|
||
悬停在我上面
|
||
</div>
|
||
</body>
|
||
</html>
|
||
```
|