fyne的border布局01

border布局01

边框布局可能是最广泛用于构建用户界面的布局，因为它允许将项目定位在中心元素周围，而中心元素将扩展以填充空间。

案例1

package main

import (
	"fyne.io/fyne/v2"
	"fyne.io/fyne/v2/app"
	"fyne.io/fyne/v2/canvas"
	"fyne.io/fyne/v2/container"
	"image/color"
)

func main() {
	myApp := app.New()
	myWindow := myApp.NewWindow("Border Layout")

	top := canvas.NewText("content1", color.Black)
	bottom := canvas.NewText("content2", color.Black)
	left := canvas.NewText("content3", color.Black)
	right := canvas.NewText("content4", color.Black)
	content := container.NewBorder(top, bottom, left, right)
	myWindow.Resize(fyne.NewSize(400, 300))
	myWindow.SetContent(content)
	myWindow.ShowAndRun()
}

效果如下:

案例2

除了前面4个参数，再加入其它对象进去，会防止在中间位置。

package main

import (
	"fyne.io/fyne/v2"
	"fyne.io/fyne/v2/app"
	"fyne.io/fyne/v2/canvas"
	"fyne.io/fyne/v2/container"
	"image/color"
)

func main() {
	myApp := app.New()
	myWindow := myApp.NewWindow("Border Layout")

	top := canvas.NewText("content1", color.Black)
	bottom := canvas.NewText("content2", color.Black)
	left := canvas.NewText("content3", color.Black)
	right := canvas.NewText("content4", color.Black)
	middle1 := canvas.NewText("middle1", color.Black)
	middle2 := canvas.NewText("middle2", color.Black)
	content := container.NewBorder(top, bottom, left, right, middle1, middle2)
	myWindow.Resize(fyne.NewSize(400, 300))
	myWindow.SetContent(content)
	myWindow.ShowAndRun()
}

效果如下:

可以看到middle1和middle2挤在了一起。

可以使用其它container进行再次布局。

content := container.NewBorder(top, bottom, left, right, container.NewCenter(middle1, middle2))

效果图如下:

可以发现middle1和middle2居中了，但是还是挤在了一起。

content := container.NewBorder(top, bottom, left, right,
		container.NewCenter(
			container.NewVBox(middle1, middle2)))

效果图如下: