Fyne布局
# Fyne
库布局
使用GUI
库的时候第一关就是布局问题,本文将介绍Fyne
库的布局。
# 创建一个简单的窗口
// 创建一个新窗口
a := app.New()
// 设置窗口的标题
mainWindow := app.NewWindow(common.AppName)
// 设置窗口大小
mainWindow.Resize(fyne.NewSize(1000, 700))
// 运行窗口
mainWindow.ShowAndRun()
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 布局
# 横向布局
对象将从左到右放置在容器中。
text1 := canvas.NewText("11111", color.Black)
text2 := canvas.NewText("22222", color.Black)
text3 := canvas.NewText("33333", color.Black)
mainWindow.SetContent(container.NewHBox( // 给窗口添加控件
text1, // 标签控件
text2, // 标签控件
text3, // 标签控件
))
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 纵向布局
这些物体将从上到下堆叠在容器中。
text1 := canvas.NewText("11111", color.Black)
text2 := canvas.NewText("22222", color.Black)
text3 := canvas.NewText("33333", color.Black)
mainWindow.SetContent(container.NewVBox( // 给窗口添加控件
text1, // 标签控件
text2, // 标签控件
text3, // 标签控件
))
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 居中布局
text1 := canvas.NewText("11111", color.Black)
text2 := canvas.NewText("22222", color.Black)
text3 := canvas.NewText("33333", color.Black)
mainWindow.SetContent(container.NewCenter( // 给窗口添加控件
text1, // 标签控件
text2, // 标签控件
text3, // 标签控件
))
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 表单布局
在
fyne v2.2.2
中表单布局的方法未找到
text1 := canvas.NewText("11111", color.Black)
text2 := canvas.NewText("22222", color.Black)
text3 := canvas.NewText("33333", color.Black)
mainWindow.SetContent(container.NewForm( // 给窗口添加控件
text1, // 标签控件
text2, // 标签控件
text3, // 标签控件
))
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 组合布局
text1 := canvas.NewText("11111", color.Black)
text2 := canvas.NewText("22222", color.Black)
text3 := canvas.NewText("33333", color.Black)
con1 := container.NewVBox(hello1, hello2 )
con2 := container.NewVBox(button, hello3)
mainWindow.SetContent(container.NewHBox(con1, con2))
1
2
3
4
5
6
2
3
4
5
6
# 自适应布局(均匀布局)
text1 := canvas.NewText("11111", color.Black)
text2 := canvas.NewText("22222", color.Black)
text3 := canvas.NewText("33333", color.Black)
mainWindow.SetContent(container.NewAdaptiveGrid( // 给窗口添加控件
text1, // 标签控件
text2, // 标签控件
text3, // 标签控件
))
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
更新时间: 2023/2/10 09:50:10