Wails开发桌面GUI

开发wails的时候尽可能把它想象成开发vue的场景
go install github.com/wailsapp/wails/v2/cmd/wails@latest 安装

wails init -n myapp -t vue 创建一个vue的项目
cd myapp 进入这个myapp

.项目初始结构

├── build						//项目构建目录
│   ├── appicon.png	//应用程序图标
│   ├── darwin/			//Mac 特定的项目文件
│   └── windows/		//特定于 Windows 的项目文件
├── frontend/				//前端项目文件
├── go.mod						/模块文件
├── go.sum					Go 模块校验和文件
├── main.go					//主应用程序
└── wails.json			//项目配置

wails dev 运行
wails build 编译
编译后可执行文件会在build/bin目录中

main.go的初始内容像这样：

package main

import (
    "embed"
    "github.com/wailsapp/wails/v2"
    "github.com/wailsapp/wails/v2/pkg/options"
    "github.com/wailsapp/wails/v2/pkg/options/assetserver"
)

//go:embed all:frontend/dist
var assets embed.FS

func main() {
    // 创建一个新的app
    app := NewApp()

    // 以参数启动
    err := wails.Run(&options.App{
        Title:  "这是一个测试程序",
        Width:  1024,
        Height: 768,
        // 服务器
        AssetServer: &assetserver.Options{
            Assets: assets,
        },
        BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
        OnStartup:        app.startup, // 启动时运行
        // OnShutdown: 	 app.shutdown, // 关闭时运行
        Bind: []interface{}{
            app,  // 绑定app
        },
    })

    if err != nil {
        println("Error:", err.Error())
    }
}

而需要运行的程序它写在app.go:

// 这个页面定义了App结构体，联通前后端的方法，这里定义了一个App结构体
//所有包含func (a *App) 都属于App结构体方法，它在main.go中被绑定到前端
package main

import (
    "context"  // 上下文
    "fmt"
)

// APP结构体，上下文管理
type App struct {
    ctx context.Context
}

// 创建一个新实列APP返回APP结构体指针
func NewApp() *App {
    return &App{}
}

// 启动时运行，这是绑定到APP结构体生命周期的方法,它在main.go中被绑定到前端
func (a *App) startup(ctx context.Context) {
    a.ctx = ctx
    fmt.Println("程序启动")
}

// // 关闭时运行
// func (a *App) shutdown(ctx context.Context) {
// 	a.ctx = ctx
// 	fmt.Println("程序关闭")
// }

// 这是一个前端可以调用的方法
func (a *App) Greet(name string) string {
    return fmt.Sprintf("你输入了 %s, 这是go生成", name)
}

在前端调用后端Greet方法

<script setup>
//导入后端方法
import {Greet} from '../../wailsjs/go/main/App'

function greet() {
  Greet(data.name).then(result => {
    data.resultText = result
  })
}
</script>

修改图标

项目根目录\build\appicon.png 尺寸：1024*1024
删除icon.ico重新运行后会生成新的ico
项目根目录\build\windows\icon.ico