golang用wails开发类似360的悬浮球(二)

关于后续

距离上篇文章发布有差不多一年了,第一次写博客,开始信心满满,结果发现搜索引擎根本搜不到,于是乎觉得自己写的东西别人应该是看不到,最近无意间发现有人评论,本着自己学习,帮助他人的想法,今天完成wails悬浮球的后续。

窗体属性

由于我不是c系列的开发人员,为了隐藏wails在任务栏的图标,搜索了很多资料,甚至尝试了从任务栏所在的窗体入手修改windows的ui,虽然感觉我在绕路,但网上相关资料确实太少,总之搜索到的资料就是如果用c++写怎么怎么样就可以实现图标在任务栏隐藏,但是wails提供的窗口设置属性实在太少,在尝试了无数种办法后,只能是查看wails的源码了。

修改源码

在这里插入图片描述

如图经过慢慢找最终windows的窗口属性在这个位置被设置,就是我们在app.go设置的窗体属性会在这里被设置到窗体上,在第71行我加入了一行代码(我的idea能临时编辑源码)


exStyle=w32.WS_EX_NOREDIRECTIONBITMAP|w32.WS_EX_TOOLWINDOW|w32.WS_EX_TOPMOST


上面的代码作用,是创建一个混合渲染、在顶部、工具栏的窗口WS_EX_TOOLWINDOW这个属性是关键,窗口的图标不在任务栏显示,直接百度WS_EX_TOOLWINDOW这个关键字能出现详细说明。另外在这里能拓展windows窗体的各种功能。

给个边框加点样式

在这里插入图片描述

更好看的样式就百度各种特效,旋转啦、发光了等,wails的ui完全是个网页可以自由发挥,现在我们已经实现了大半,隐藏了任务栏图标,现在需要在系统托盘添加图标。

系统托盘图标实现

先找一张png的图片,我们就用悬浮球那张图片
在这里插入图片描述
先复制出来,观察build目录下,appiocn.png图片
在这里插入图片描述
没错你会发现这张图片就是wails的图标图片,现在你需要把桌面的那张图片修改名称替换这种图片
在这里插入图片描述
然后删除build ----》windows下的icon.ico
在这里插入图片描述
之后启动wails 运行 wails dev ,然后build ----》windows下的icon.ico会重新生成,并且是我们替换后的图片了,ico格式是图标图片,系统托盘的图标要用这种格式。接下来就是把图标放入系统托盘,这里我们使用github.com/getlantern/systray这个包来完成,详细教程可以自行百度
完整的appgo代码
在这里插入图片描述

package main

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

	"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() {
	// Create an instance of the app structure
	app := NewApp()

	// Create application with options
	err := wails.Run(&options.App{
		Title:  "test",
		Width:  130,
		Height: 130,
		AssetServer: &assetserver.Options{
			Assets: assets,
		},
		BackgroundColour: &options.RGBA{R: 0, G: 0, B: 0, A: 0},
		OnStartup:        app.startup,
		OnDomReady:       app.OnDomReady,
		Bind: []interface{}{
			app,
		},
		AlwaysOnTop: true, //最上层
		Frameless:   true, //无边框
		Windows: &windows.Options{

			WebviewIsTransparent:              true, //网页透明
			WindowIsTranslucent:               true, //窗口透明
			DisableFramelessWindowDecorations: true,
		},
	})

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

完整的app.go

package main

import (
	"context"
	"fmt"
	"github.com/getlantern/systray"
	"github.com/wailsapp/wails/v2/pkg/runtime"
	"io/ioutil"
)

// App struct
type App struct {
	ctx context.Context
}

// NewApp creates a new App application struct
func NewApp() *App {
	return &App{}
}

// startup is called when the app starts. The context is saved
// so we can call the runtime methods
func (a *App) startup(ctx context.Context) {
	a.ctx = ctx
	go systray.Run(onReady, onExit)
}

// Greet returns a greeting for the given name
func (a *App) Greet(name string) string {
	return fmt.Sprintf("Hello %s, It's show time!", name)
}

var mShow, mHide, mQuit *systray.MenuItem

func onReady() {
	b, err := ioutil.ReadFile("D://icon.ico") //这里我把生成的图标放到D盘了
	if err != nil {
		fmt.Print(err)
	}
	systray.SetIcon(b)
	systray.SetTooltip("服务已最小化右下角, 右键点击打开菜单!")
	mShow = systray.AddMenuItem("显示", "显示窗口")
	mHide = systray.AddMenuItem("隐藏", "隐藏窗口")
	systray.AddSeparator()
	mQuit = systray.AddMenuItem("退出", "退出程序")

	fmt.Println("结束~~~~1~~")
}

func onExit() {
	// clean up here
	fmt.Println("77777-5555-5555")
}
func (a *App) OnDomReady(ctx context.Context) {
	fmt.Println(334)
	var c = ctx
	fmt.Println(456)
	go func() {
		for {
			fmt.Println("--1----1----")

			select {
			case <-mShow.ClickedCh:
				fmt.Println("显示")
				runtime.Show(c)
				runtime.WindowUnminimise(c)
				runtime.WindowSetAlwaysOnTop(c, true)
			case <-mHide.ClickedCh:
				fmt.Println("隐藏")
				runtime.Hide(c)
			case <-mQuit.ClickedCh:
				fmt.Println("退出")
				runtime.Quit(c)
			}
		}
	}()

}

后记

wails 是我最喜欢的一个go项目,其实还有好多想分享,多窗体的实现,上传文件,拦截请求等,但是是真的看的人太少,所以如果我还继续写博客那么接下来我会开始jvm的研究,用go写一个虚拟机,目的是为了继续学习go加深java的理解。
源码下载
https://download.youkuaiyun.com/download/wangkai031/88779716

Wails 是一个使用 Go 编程语言创建跨平台本机应用程序的框架,它允许您使用 Go 编写前端和后端代码。Wails 提供了一个简单的方式来构建具有本机外观和感觉的应用程序,可以在所有主要平台上运行,包括 Windows、macOS 和 Linux。 要使用 Wails 开发 UI 窗口,可以遵循以下步骤: 1. 安装 Wails 首先,您需要安装 Wails。您可以访问官方网站 https://wails.app/ ,根据您的操作系统选择对应的安装包进行安装。 2. 创建新项目 使用 `wails init` 命令在您的工作目录中创建新项目。该命令将生成一个基本的 Wails 项目结构。 3. 创建 UI 窗口 在项目的 `frontend` 目录下创建一个 HTML 文件,该文件将作为窗口的 UI 界面。您可以使用 HTML、CSS 和 JavaScript 来创建您的 UI 界面。Wails 使用 Go 的 Webview 库来呈现 UI 界面。 4. 连接前端和后端 在项目的 `backend` 目录下创建一个 Go 文件,该文件将作为窗口后端处理逻辑。您可以使用 Go 编写您的业务逻辑,并将其与前端交互。Wails 提供了一些方便的方法来实现前后端之间的通信。 5. 构建应用程序 使用 `wails build` 命令构建您的应用程序。该命令将生成适用于您的操作系统和架构的进制文件。 6. 运行应用程序 使用 `./<yourapp>` 命令运行您的应用程序。您将看到一个带有本机外观和感觉的 UI 界面,可以在其中与您的后端进行交互。 以上是使用 Wails 开发 UI 窗口的基本步骤。您可以使用 Wails 提供的其他功能来扩展您的应用程序。
评论 8
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

wangkai031

您的鼓励是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值