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

Question

我想要扩展和拉伸的框来布置小部件，以便我的应用程序看起来像这样：

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

我尝试将此代码与 Box 一起使用（因为我没有在 documentation 中找到任何 "free" 布局）：

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

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

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()
}

Answer 2

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

为了打包整个应用程序UI，您更可能希望直接使用容器，例如fyne.NewContainerWithLayout(layout.NewBorderLayout(...), ...)。您可能会找到 Fyne Tour helpful, specifically BorderLayout.

的布局部分

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

How make expanded and stretched layout box with Fyne

go

fyne