Wails经验

# 前言

使用Wails开发中的经验，本文持续更新

# `wails v2` 如何使用 `Goland` 调试

# 创建项目的时候加上 `--ida goland` 即可

wails init -n yourProject --ide goland

# 如何使用 `Wails v3`

wails v3 因为还在 alpha 阶段，并不保证正式版发布后会沿用此写法 v3 需要使用到 go 1.21

# 安装 `wails v3`

从 GitHub 上面 clone wails (opens new window)
切换到 v3-alpha 分支
安装 v3 cli
1. Windows 命令行操作 cd wails\v3\cmd\wails3 && go install
2. macOS 命令操作 cd wails/v3/cmd/wails3 && go install

# `wails v3` 创建以及运行项目

# 先创建项目
wails3 init -n myproject -t vue
# 运行项目
cd myproject && wail3 task build

1
2
3
4

然后到开发工具中的 main.go 文件中运行即可

需要注意的地方，目前的 V3 版本并不支持实时预览，需要进行编译后再处理

# `Wails V3` 在 `GoLand` 中使用 `debug` 模式

在 Wails 项目中，打开 GoLand 的「运行/调试配置」，点击「+」，选择「Go Build」，然后在「运行种类」中选择「软件包」，在「环境」中输入 export CGO_LDFLAGS="-framework UniformTypeIdentifiers" ，在「 Go 工具实参」中输入 -tags dev -gcflags "all=-N -l"

# `wails v3` 小问题

# `wails v3` 如何自定义菜单栏的图标

  //创建托盘
	systemTray := app.NewSystemTray()
  // 假设您的资源文件在frontend/public/下
	b, _ := assets.ReadFile("frontend/dist/logo120x.png")
  // 假设您的资源文件在 xingcxb.com/access/下
  // b, _ := assets.ReadFile("access/logo120x.png")
	systemTray.SetTemplateIcon(b)

1
2
3
4
5
6
7

需要注意的是

您的资源文件放在了 frontend/public 下的话，那么读取的地址就应该为上面的代码

您的资源文件在 go 代码中，那么直接按根目录去读取即可

# `wails v3` 设置窗口位置时出现闪烁的情况

声明完 *application.WebviewWindow 后立刻设置窗口位置即可

注意：

wails v3 中的 macOS 坐标是左下角为原点，即(0,0)

wails v3 中创建 *application.WebviewWindow 必须要声明窗口的宽度和高度，不然的话设置坐标的时候容易出现无效的情况，目前不知道是否为 bug

mainWindow := app.NewWebviewWindowWithOptions(application.WebviewWindowOptions{
  ...
})
mainWindow.SetAbsolutePosition(0, 0)

1
2
3
4

# `wails v3` 获取屏幕出现失败

大概率是遇到了 *application.App 没有加载完毕，我的做法是：初始化后并不创建窗口，直接等待点击后再来创建一个窗口，然后再通过 app.GetPrimaryScreen() 来获取屏幕的宽度和高度。

# `wails v3` 失去焦点隐藏时再次点击出来的时候出现忙碌的情况

我遇到的情况应该是阻碍了主线程导致的，直接使用协程包裹一下就没事了

func WindowLostFocus(window *application.WebviewWindow) {
	window.RegisterHook(events.Common.WindowLostFocus, func(e *application.WindowEvent) {
		// 目前这里出现了卡顿的情况
		go func() {
			window.Hide()
		}()
	})
}

1
2
3
4
5
6
7
8

# `wails v3` 隐藏窗口再次显示

注意：

在通过 *application.App 声明一个新的 NewWebviewWindowWithOptions 时需要添加 Name 属性

mainWindowName 是我定义的窗口名称

	if w, ok := app.GetWindowByName(mainWindowName).(*application.WebviewWindow); ok {
		// 判断如果当前的窗口已经存在，则显示并聚焦
		w.Show().Focus()
		return
	}

1
2
3
4
5

# `wails v3` 如何使用事件

目前因为 V3 还处于 alpha 阶段，可能后续有进行改变的可能，所以此方案仅供参考

前端和后端的数据传输都是通过 *application.WailsEvent 来进行的，数据传输就在 Data 中进行，事件的名称就在 Name 中进行

go 代码中在 *application.App 中绑定监听函数

// 假设 app 为 *application.App
// 处理监听中指定名字的数据
 app.Events.On("myEventToCore",func(e *application.WailsEvent) {
   data := ""
   ...
   // 将处理后的数据返回给前台
   app.Events.Emit(&application.WailsEvent{
     Name: "myEventToFrontend", // 绑定事件名称
     Data: data, // 绑定事件从前端获取到的数据
   })
 }

1
2
3
4
5
6
7
8
9
10
11

前端代码中

...
function sendData(){
  <!-- 发送数据到后端，通过name标记的名字由后端识别并解释 -->
  wails.Events.Emit({name: "myEventToCore", Data:""})
  <!-- 监听后端发回来的数据，通过name标记的名字来进行处理 -->
  wails.Events.Once("myEventToFrontend", function (data) {
    let currentHTML = document.getElementById("results").innerHTML;
    document.getElementById("results").innerHTML = currentHTML + "<br/>" + JSON.stringify(data);
  })
}
...

1
2
3
4
5
6
7
8
9
10
11

# `wails v3` 如何在初始化时出现错误弹出提示框，并退出程序

我个人的经验就是在 main.go 中使用协程，然后在初始化的时候会报错的函数上面延时 1s 后再进行处理，这样就可以在初始化的时候出现错误弹出提示框，并退出程序

main.go

func main() {
  ...
  go func() {
    // 初始化数据库
    db.InitDB()
    // 判断是否启动成功
    if !db.Sqlite3Status {
      app.Quit()
    }
  }()
  ...
  app.Run()
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

sqlite3Db.go

var (
	sqlite3Db *sql.DB // sqlite3数据库连接
	// Sqlite3Status 启动状态，默认为false。true：启动，false：未启动
	Sqlite3Status = false
)

func InitDb(){
  time.Sleep(1 * time.Second)
  ...
  if err != nil {
    // 弹出提示框
    ....
  }
  Sqlite3Status = true
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# `wails v3` 如何打包应用程序

注意：目前 wails v3 还处于 alpha 阶段，打包的功能还没有完善，所以目前的打包方式仅供参考 s3 build -p windows


- `macOS` 打包

``` shell
wails3 task create-app-bundle

1
2
3
4
5

# `wails v3` 如何在调试中申请自动化权限

如果是正常的 wails3 task build 的话，那么在调试中是无法申请自动化权限的，需要在 wails3 task build 之后再进行 wails3 task create-app-bundle 打包，然后在打包后的 app 中进行调试。但是都已经打包了也就不符合我开发过程中调试的目的了，所以想了一个骚方法，另外没有那么多弯弯绕绕不需要去特别申请什么自动化的权限...一切交给系统吧

// 启动时就申请一个权限，后面代码可以撤销
cmd := exec.Command("osascript", "-e", `tell application "System Events" to display dialog "Hello, World!"`)
err := cmd.Run()
if err != nil {
  log.Fatal(err)
}
app := application.New(...)  
...

1
2
3
4
5
6
7
8

# `wails v3` 中窗口关闭后再次激活窗口出现两个事件绑定

原因是因为 wails v3 中的 app.Events.On 是绑定的全局事件，所以在窗口关闭后再次激活窗口的时候会再次绑定事件，所以需要在窗口关闭的时候将事件解绑

...
app.Events.On(common.EventsHandleCardDoubleClickToCore, func(e *application.WailsEvent) {
  // 关闭事件
  app.Events.Off(common.EventsHandleCardDoubleClickToCore)
})
...

1
2
3
4
5
6

# `wails v3` 在 `Windows` 下运行出现一个 `cmd` 窗口

构建的时候加上 -ldflags="-H windows gui" 即可

# 遭遇过的错误

# `Rollup failed to resolve import "/vite.svg" from`

在 App.vue 文件中指定 vitejs 的 svg 文件不存在，改下就好了

# `Wails v3` 中绑定 `URL` 无效

如果采用的是 <router-view :key:="..." /> 那么这个时候在 go 代码中需要使用 #/... 来进行绑定，而不是直接使用链接

#Wails #Wails V3 #V3 #经验 #技巧 #GoLang #GoLand #Debug

更新时间: 2023/11/28 16:52:04

← Wails错误集合 Hello GoFrame→

Wails经验

# 前言

# wails v2 如何使用 Goland 调试

# 创建项目的时候加上 --ida goland 即可

# 如何使用 Wails v3

# 安装 wails v3

# wails v3 创建以及运行项目

# Wails V3 在 GoLand 中使用 debug 模式

# wails v3 小问题

# wails v3 如何自定义菜单栏的图标

# wails v3 设置窗口位置时出现闪烁的情况

# wails v3 获取屏幕出现失败

# wails v3 失去焦点隐藏时再次点击出来的时候出现忙碌的情况

# wails v3 隐藏窗口再次显示

# wails v3 如何使用事件

# wails v3 如何在初始化时出现错误弹出提示框，并退出程序

# wails v3 如何打包应用程序

# wails v3 如何在调试中申请自动化权限

# wails v3 中窗口关闭后再次激活窗口出现两个事件绑定

# wails v3 在 Windows 下运行出现一个 cmd 窗口