普拉多VX

人生一路，不问来时，不知归期

0%

Golang Windows GUI开发实战之lxn/Walk (二)

发表于 分类于 阅读次数： Valine：

主窗体

使用MainWindow结构体定义主窗体

样例

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

MainWindow{
		Title:   "GUI程序",
		MinSize: Size{600, 400},
		Layout:  VBox{},
		Children: []Widget{
			HSplitter{
				Children: []Widget{
					TextEdit{AssignTo: &inTE},
					TextEdit{AssignTo: &outTE, ReadOnly: true},
				},
			},
			PushButton{
				Text: "转换",
				OnClicked: func() {
					outTE.SetText(strings.ToUpper(inTE.Text()))
				},
			},
		},
	}.Run()

常用属性

以下我列出目前阶段我常用的属性设置，后面待补充，或者自己参考源码。

  • Title: 程序头部标题
  • MinSize: 定义最小窗体（默认窗体可以拖动）如设置即：默认窗体可缩小的最小比例 分别为宽度,高度像素
  • MaxSize: 定义最大窗体（默认窗体可以拖动）如设置即：默认窗体可缩大的最大比例 分别为宽度,高度像素
  • Layout: 全局布局类型
  • Children: 控件集
  • MenuItems: 程序菜单栏
  • TooBar: 工具栏
  • Font: 窗体文字样式，使用Font:Font{} 结构体方式声明。
  • Icon: 设置Icon图标路径 使用Icon: “img/xx.ico”

参考-字体样例

1
2
3
4
5
font := Font{
	Family: "Times New Roman", //字体
	PointSize: 10,  //大小
	Bold: true, //是否加粗
}

参考-菜单定义

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 定义菜单
MenuItems: []MenuItem{

	Menu{
		Text: "&关于",
		Items: []MenuItem{
			Action{
				Text: "版本",
				OnTriggered: func() {
					walk.MsgBox(mw, "版本", versionStr, walk.MsgBoxIconInformation)
				},
			},
			//...
		},
	},
},

布局

主窗体布局可以使用两种布局方式，分别为VBox和HBox。具体的布局根据自己程序的设计自己选择。

  • VBox(垂直布局)
  • HBox(水平布局)

菜单栏

菜单定义使用Menu属性

  • Text: 文字定义
  • OnTriggered: 点击事件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
// 定义菜单
MenuItems: []MenuItem{
	Menu{
		Text: "&系统", 
		Items: []MenuItem{
			Action{
				Text:        "退出",
				OnTriggered: func() { mw.Close() },
			},
		},
	},

	Menu{
		Text: "&关于",
		Items: []MenuItem{
			Action{
				Text: "版本",
				OnTriggered: func() {
					walk.MsgBox(mw, "版本", versionStr, walk.MsgBoxIconInformation) //弹出消息框，类型为info
				},
			},
			Action{
				Text: "联系我们",
				OnTriggered: func() {
					walk.MsgBox(mw, "联系我们", "开发者:蓝谷骑兵\nQQ:923401910", walk.MsgBoxIconInformation)
				},
			},
		},
	},
},

工具栏

ToolBar声明，源码中定义了4中ToolBar样式，分别为以下几种

  • ToolBarButtonImageOnly //单一图片样式
  • ToolBarButtonTextOnly //单一文字样式
  • ToolBarButtonImageBeforeText //图片在文字之前
  • ToolBarButtonImageAboveText //图片在文字之上
1
2
3
4
5
6
7
8
9
10
11
12
13
TooBar: TooBar{
	ButtonStyle: 样式,
	Items:[]MenuItem{
		ActionRef{Action},
		Menu{
			//工具栏一
		},
		Separator{}, // 分割线
		Menu{
			//工具栏二
		},
	}
}

参考样图

源码样例