How to SetSize of LinearLayout in GXUI

Question

I'm trying to make a grid with GXUI, I use LinearLayout for rows and columns, but I have a problem with resizing it.

package main

import (
  "fmt"

  "github.com/google/gxui"
  "github.com/google/gxui/math"
  "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)
  size := window.Viewport().SizeDips()

  grid := theme.CreateLinearLayout()
  grid.SetDirection(gxui.TopToBottom)
  grid.SetSizeMode(gxui.Fill)

  for y := 0; y < 4; y++ {
    row := theme.CreateLinearLayout()
    row.SetDirection(gxui.LeftToRight)

    for x := 0; x < 4; x++ {
      label := theme.CreateLabel()
      label.SetText(fmt.Sprintf("%d", y*4+x))

      cell := theme.CreateLinearLayout()
      cell.SetDirection(gxui.TopToBottom)
      cell.SetSize(math.Size{W: size.W/4, H: size.H/4}) // not actually resizes
      cell.AddChild(label)

      row.AddChild(cell)
    }

    grid.AddChild(row)
  }

  window.AddChild(grid)
}

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

This is the result:

This is the result

Update: GXUI has TableLayout now

To where/how do you add `grid`? Can you show us full code? – icza Jun 30 '15 at 10:37 — icza, Jun 30 '15 at 10:37
Yep, I have updated the question – Maxim Samburskiy Jun 30 '15 at 10:45 — Maxim Samburskiy, Jun 30 '15 at 10:45

Barry McNamara · Accepted Answer · 2015-07-07T21:28:27.843

You don't need to resize anything. Setting up the LinearLayouts as you are trying to do should have the same effect, but you are making each LinearLayout contain a single label. To make a 4x4 grid, you want one row of 4 columns, with each column having 4 labels. That will make everything grid nicely. Here is code that does that.

code:

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 < 4; 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)
}

How to SetSize of LinearLayout in GXUI

1 Answers1