How make expanded and stretched layout box with Fyne

Question

I want expanded and stretched box for layouting widgets, so that my application looks like this:

I.e. top and middle box both lengthy in both direction.

I tried use this code with Box(because I didn't found any "free" layouting in the documentation):

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

But it's definitely not the same thing:

Does fyne support such layouting and how to do it properly?

Answer 1

Like this? Or describe more details.

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

---

EDIT: tried NewBorderLayout but not sure if this is what you want.

Do not forget to tell me the right way when you get it. Good luck!

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