go - 如何使用 Fyne 制作扩展和拉伸的布局框

Question

我想要用于布局小部件的扩展和拉伸框，以便我的应用程序如下所示：

即顶部和中间的盒子在两个方向上都很长。

我尝试将此代码与 Box 一起使用（因为我在文档中没有找到任何“免费”布局）：

package main

import (
    "fyne.io/fyne"
    "fyne.io/fyne/app"
    "fyne.io/fyne/layout"
    "fyne.io/fyne/widget"
)

func main() {
    f := app.New()
    w := f.NewWindow("")
    label1 := widget.NewLabel("Label1")

    b1 := widget.NewButton("Button1", func() {})
    b2 := widget.NewButton("Button2", func() {})
    label2 := widget.NewLabel("Label3")

    w.SetContent(
        fyne.NewContainerWithLayout(
            layout.NewVBoxLayout(),
            fyne.NewContainerWithLayout(layout.NewVBoxLayout(), label1),
            fyne.NewContainerWithLayout(layout.NewHBoxLayout(), layout.NewSpacer(), b1, b2, layout.NewSpacer()),
            label2),
    )

    w.ShowAndRun()
}

但这绝对不是一回事：

fyne 是否支持这种布局以及如何正确执行？

Answer 1

如果您希望扩展中心内容，我建议您使用 BorderLayout，Box 小部件旨在将项目打包而不是展开。VBox 将扩展宽度并使用元素的 minSize 作为它们的高度（以创建一个偶数列表），而 HBox 将扩展高度同时保持项目的最小宽度（如按钮栏）。

为了打包整个应用程序 UI，您更有可能直接使用容器，例如fyne.NewContainerWithLayout(layout.NewBorderLayout(...), ...). 您可能会发现Fyne Tour的布局部分很有帮助，特别是BorderLayout。

Answer 2

像这样？或者描述更多细节。

package main

import (
    "fyne.io/fyne"
    "fyne.io/fyne/app"
    "fyne.io/fyne/layout"
    "fyne.io/fyne/widget"
)

func main() {
    f := app.New()
    w := f.NewWindow("")
    label1 := widget.NewLabel("Label1")

    b1 := widget.NewButton("Button1", func() {})
    b2 := widget.NewButton("Button2", func() {})
    label2 := widget.NewLabel("Label3")

    w.SetContent(
        fyne.NewContainerWithLayout(
            layout.NewVBoxLayout(),
            fyne.NewContainerWithLayout(layout.NewHBoxLayout(), layout.NewSpacer(), label1, layout.NewSpacer()),
            layout.NewSpacer(),
            fyne.NewContainerWithLayout(layout.NewHBoxLayout(), layout.NewSpacer(), b1, b2, layout.NewSpacer()),
            layout.NewSpacer(),
            fyne.NewContainerWithLayout(layout.NewHBoxLayout(), layout.NewSpacer(), label2, layout.NewSpacer()),
        ),
    )

    w.Resize(fyne.Size{Height: 320, Width: 480})

    w.ShowAndRun()
}

---

编辑：试过NewBorderLayout但不确定这是否是你想要的。

拿到的时候别忘了告诉我正确的方法。祝你好运！

package main

import (
    "fmt"

    "fyne.io/fyne"
    "fyne.io/fyne/app"
    "fyne.io/fyne/layout"
    "fyne.io/fyne/widget"
)

func main() {
    f := app.New()
    w := f.NewWindow("")
    label1 := widget.NewLabel("Label1")

    b1 := widget.NewButton("Button1", func() { fmt.Println("button1") })
    b1.ExtendBaseWidget(b1)

    b2 := widget.NewButton("Button2", func() { fmt.Println("button2") })
    b2.ExtendBaseWidget(b2)

    label2 := widget.NewLabel("Label3")

    labox1 := fyne.NewContainerWithLayout(layout.NewGridLayoutWithRows(3),
        fyne.NewContainerWithLayout(
            layout.NewCenterLayout(),
            label1,
        ))

    labox2 := fyne.NewContainerWithLayout(layout.NewCenterLayout(), label2)

    w.SetContent(
        fyne.NewContainerWithLayout(
            layout.NewBorderLayout(
                labox1,
                labox2,
                nil,
                nil,
            ),
            labox1,
            labox2,
            fyne.NewContainerWithLayout(
                layout.NewAdaptiveGridLayout(2),
                b1,
                b2,
            ),
        ),
    )

    w.Resize(fyne.Size{Height: 320, Width: 480})

    w.ShowAndRun()
}