使用 GXUI 使 window 在 Go 中滚动

Question

我正在尝试使用 GXUI 向我的应用程序 windows 添加滚动条。

假设我有这个代码：

package main

import (
    "fmt"

    "github.com/google/gxui"
    "github.com/google/gxui/drivers/gl"
    "github.com/google/gxui/samples/flags"
    "github.com/google/gxui/themes/dark"
)

func appMain(driver gxui.Driver) {
    theme := dark.CreateTheme(driver)

    window := theme.CreateWindow(800, 600, "Grid")
    window.SetScale(flags.DefaultScaleFactor)
    window.OnClose(driver.Terminate)

    row := theme.CreateLinearLayout()
    row.SetDirection(gxui.LeftToRight)
    for c := 0; c < 4; c++ {
        col := theme.CreateLinearLayout()
        col.SetDirection(gxui.TopToBottom)
        for r := 0; r < 100; r++ {
            cell := theme.CreateLabel()
            cell.SetText(fmt.Sprintf("%d", r*4+c))
            col.AddChild(cell)
        }
        row.AddChild(col)
    }

    window.AddChild(row)
}

func main() {
    gl.StartDriver(appMain)
}

当我运行它时，我得到这个 window:

如何让 window 有滚动条以便我可以查看所有行？

Answer 1

我无法使用 help ScrollLayout 来完成，但我可以根据 github 中的示例提出此变体。

package main

import (
    "fmt"
    "github.com/google/gxui"
    "github.com/google/gxui/drivers/gl"
    "github.com/google/gxui/math"
    "github.com/google/gxui/samples/flags"
    "github.com/google/gxui/themes/dark"
)

type customAdapter struct {
    gxui.AdapterBase
}

func (a *customAdapter) Count() int {
    return 1000
}

func (a *customAdapter) ItemAt(index int) gxui.AdapterItem {
    return index
}

func (a *customAdapter) ItemIndex(item gxui.AdapterItem) int {
    return item.(int)
}

func (a *customAdapter) Size(theme gxui.Theme) math.Size {
    return math.Size{W: 200, H: 25}
}

func (a *customAdapter) Create(theme gxui.Theme, index int) gxui.Control {

    layout1 := theme.CreateLinearLayout()
    layout1.SetDirection(gxui.LeftToRight)
    for c := 0; c < 4; c++ {
        col := theme.CreateLinearLayout()
        col.SetDirection(gxui.TopToBottom)
        cell := theme.CreateLabel()
        cell.SetText(fmt.Sprintf("%d", index*4+c))
        col.AddChild(cell)
        layout1.AddChild(col)
    }
    return layout1
}

func appMain(driver gxui.Driver) {
    theme := dark.CreateTheme(driver)
    window := theme.CreateWindow(600, 400, "Grid")
    window.BorderPen()
    window.SetScale(flags.DefaultScaleFactor)
    window.OnClose(driver.Terminate)
    adapter := &customAdapter{}
    list := theme.CreateList()
    list.SetAdapter(adapter)
    list.SetOrientation(gxui.Vertical)
    window.AddChild(list)
}

func main() {
    gl.StartDriver(appMain)
}

每一行都放在列表中，它们的数量和大小在覆盖的方法中指定。好处是列表中已经有滚动条了。

Answer 2

以下代码使用 ScrollLayout 向 window 添加滚动条。诀窍是使 ScrollLayout 成为 window 的子元素，并使下一个小部件（在本例中为 LinearLayout）成为 ScrollLayout 的子元素。

package main

import (
    "fmt"
    "github.com/google/gxui"
    "github.com/google/gxui/drivers/gl"
    "github.com/google/gxui/samples/flags"
    "github.com/google/gxui/themes/dark"
)

func appMain(driver gxui.Driver) {
    theme := dark.CreateTheme(driver)
    window := theme.CreateWindow(800, 600, "Grid")
    window.SetScale(flags.DefaultScaleFactor)
    window.OnClose(driver.Terminate)
    sl := theme.CreateScrollLayout()
    row := theme.CreateLinearLayout()
    row.SetDirection(gxui.LeftToRight)
    for c := 0; c < 4; c++ {
        col := theme.CreateLinearLayout()
        col.SetDirection(gxui.TopToBottom)
        for r := 0; r < 100; r++ {
            cell := theme.CreateLabel()
            cell.SetText(fmt.Sprintf("%d", r*4+c))
            col.AddChild(cell)
        }
        row.AddChild(col)
    }
    sl.SetChild(row)
    window.AddChild(sl)
}

func main() {
    gl.StartDriver(appMain)
}

请注意，当我增加行数（最右边的列开始被截断）时，我的计算机出现显示问题，但其他人没有遇到此问题，因此可能是由于安装错误我的结局。

使用 GXUI 使 window 在 Go 中滚动

Make window scroll in Go with GXUI

scroll

scrollbar

go

gxui