[GH-ISSUE #713] NewGrid() doesn't draw items when called inside AddPage() #520

New issue

Closed

opened 2026-03-04 01:05:42 +03:00 by kerem · 1 comment

kerem commented

2026-03-04 01:05:42 +03:00

Owner

Originally created by @ivdok on GitHub (Mar 17, 2022).
Original GitHub issue: https://github.com/rivo/tview/issues/713

Subj. Examples are unclear and confusing about how to stuff primitives in a grid. Consider this example:

package main

import (
	"github.com/rivo/tview"
)

var (
	app         *tview.Application
	pages       *tview.Pages
	finderFocus tview.Primitive
)

const eula = `Sample text.
`

func main() {
	app := tview.NewApplication()
	pages := tview.NewPages()
	values := tview.NewList(). //column 2
					ShowSecondaryText(true).
					SetTitle("Parameters")
	parameters := tview.NewList(). //column 1
					ShowSecondaryText(true).
					AddItem("1", "Example", 1, nil).
					AddItem("2", "Example", 2, nil).
					AddItem("3", "Example", 3, nil).
					AddItem("4", "Example", 4, nil).
					AddItem("5", "Example", 'q', func() {
			app.Stop()
		}).
		SetSelectedFunc(func(i int, s1, s2 string, r rune) {
			// values.Clear() - //undefined (type *tview.Box has no field or method Clear), WHY???
		}).
		SetBorder(true).
		SetTitle("Category")

	newPrimitive := func(text string) tview.Primitive {
		return tview.NewTextView().
			SetTextAlign(tview.AlignCenter).
			SetText(text)
	}

	pages.AddPage("eula",
		tview.NewModal().
			SetText(eula).
			AddButtons([]string{"Exit", "Next"}).
			SetDoneFunc(func(buttonIndex int, buttonLabel string) {
				if buttonIndex == 0 {
					app.Stop()
				} else {
					pages.SwitchToPage("setup")
					//app.Stop()
				}
			}),
		false,
		true)

	pages.AddPage("setup",
		tview.NewGrid().
			SetRows(3, 0, 3).
			SetColumns(30, 0).
			SetBorders(true).
			AddItem(newPrimitive("Header"), 0, 0, 1, 3, 0, 0, false).
			AddItem(newPrimitive("Footer"), 2, 0, 1, 3, 0, 0, false).
			//// Layout for screens narrower than 100 cells (menu and side bar are hidden).
			//AddItem(parameters, 0, 0, 0, 0, 0, 0, false).
			//AddItem(values, 1, 0, 1, 3, 0, 0, false).
			// Layout for screens wider than 100 cells.
			AddItem(parameters, 1, 0, 1, 1, 0, 100, false).
			AddItem(values, 1, 0, 1, 3, 0, 100, false),
		false,
		false)

	if err := app.SetRoot(pages, true).SetFocus(pages).Run(); err != nil {
		panic(err)
	}
}

When executed, after passing the first page I'm only greeted with primitives spawned by newPrimitive(). What gives? And where can I find more examples and support to use this library?

Originally created by @ivdok on GitHub (Mar 17, 2022). Original GitHub issue: https://github.com/rivo/tview/issues/713 Subj. Examples are unclear and confusing about how to stuff primitives in a grid. Consider this example: ``` package main import ( "github.com/rivo/tview" ) var ( app *tview.Application pages *tview.Pages finderFocus tview.Primitive ) const eula = `Sample text. ` func main() { app := tview.NewApplication() pages := tview.NewPages() values := tview.NewList(). //column 2 ShowSecondaryText(true). SetTitle("Parameters") parameters := tview.NewList(). //column 1 ShowSecondaryText(true). AddItem("1", "Example", 1, nil). AddItem("2", "Example", 2, nil). AddItem("3", "Example", 3, nil). AddItem("4", "Example", 4, nil). AddItem("5", "Example", 'q', func() { app.Stop() }). SetSelectedFunc(func(i int, s1, s2 string, r rune) { // values.Clear() - //undefined (type *tview.Box has no field or method Clear), WHY??? }). SetBorder(true). SetTitle("Category") newPrimitive := func(text string) tview.Primitive { return tview.NewTextView(). SetTextAlign(tview.AlignCenter). SetText(text) } pages.AddPage("eula", tview.NewModal(). SetText(eula). AddButtons([]string{"Exit", "Next"}). SetDoneFunc(func(buttonIndex int, buttonLabel string) { if buttonIndex == 0 { app.Stop() } else { pages.SwitchToPage("setup") //app.Stop() } }), false, true) pages.AddPage("setup", tview.NewGrid(). SetRows(3, 0, 3). SetColumns(30, 0). SetBorders(true). AddItem(newPrimitive("Header"), 0, 0, 1, 3, 0, 0, false). AddItem(newPrimitive("Footer"), 2, 0, 1, 3, 0, 0, false). //// Layout for screens narrower than 100 cells (menu and side bar are hidden). //AddItem(parameters, 0, 0, 0, 0, 0, 0, false). //AddItem(values, 1, 0, 1, 3, 0, 0, false). // Layout for screens wider than 100 cells. AddItem(parameters, 1, 0, 1, 1, 0, 100, false). AddItem(values, 1, 0, 1, 3, 0, 100, false), false, false) if err := app.SetRoot(pages, true).SetFocus(pages).Run(); err != nil { panic(err) } } ``` When executed, after passing the first page I'm only greeted with primitives spawned by newPrimitive(). What gives? And where can I find more examples and support to use this library?

kerem closed this issue

2026-03-04 01:05:42 +03:00

kerem commented

2026-03-04 01:05:43 +03:00

Author

Owner

@rivo commented on GitHub (Apr 15, 2022):

This is an open source project. You're free to contribute examples if you find that they will improve the documentation. If you want to contribute to the Wiki https://github.com/rivo/tview/wiki, feel free to submit Markdown code in an issue.

Regarding your code, there are a bunch of issues. For example, you're not resizing the Pages component to full-screen so the minWidth cutoff of 100 will cause two grid boxes to disappear. Also, some of your components in your grid are overlapping. And finally, functions such as SetTitle() or SetBorder() will return a Box and not a List so only a box will be drawn. Here's the same code with some fixes:

package main

import (
	"github.com/rivo/tview"
)

var (
	app         *tview.Application
	pages       *tview.Pages
	finderFocus tview.Primitive
)

const eula = `Sample text.
`

func main() {
	app := tview.NewApplication()
	pages := tview.NewPages()
	values := tview.NewList(). //column 2
					ShowSecondaryText(true)
	values.SetTitle("Parameters")
	parameters := tview.NewList(). //column 1
					ShowSecondaryText(true).
					AddItem("1", "Example", 1, nil).
					AddItem("2", "Example", 2, nil).
					AddItem("3", "Example", 3, nil).
					AddItem("4", "Example", 4, nil).
					AddItem("5", "Example", 'q', func() {
			app.Stop()
		}).
		SetSelectedFunc(func(i int, s1, s2 string, r rune) {
			// values.Clear() - //undefined (type *tview.Box has no field or method Clear), WHY???
		})
	parameters.SetBorder(true).SetTitle("Category")

	newPrimitive := func(text string) tview.Primitive {
		return tview.NewTextView().
			SetTextAlign(tview.AlignCenter).
			SetText(text)
	}

	pages.AddPage("eula",
		tview.NewModal().
			SetText(eula).
			AddButtons([]string{"Exit", "Next"}).
			SetDoneFunc(func(buttonIndex int, buttonLabel string) {
				if buttonIndex == 0 {
					app.Stop()
				} else {
					pages.SwitchToPage("setup")
					//app.Stop()
				}
			}),
		false,
		true)

	pages.AddPage("setup",
		tview.NewGrid().
			SetRows(3, 0, 3).
			SetColumns(30, 0).
			SetBorders(true).
			AddItem(newPrimitive("Header"), 0, 0, 1, 3, 0, 0, false).
			AddItem(newPrimitive("Footer"), 2, 0, 1, 3, 0, 0, false).
			//// Layout for screens narrower than 100 cells (menu and side bar are hidden).
			//AddItem(parameters, 0, 0, 0, 0, 0, 0, false).
			//AddItem(values, 1, 0, 1, 3, 0, 0, false).
			// Layout for screens wider than 100 cells.
			AddItem(parameters, 1, 0, 1, 1, 0, 100, true).
			AddItem(values, 1, 1, 1, 2, 0, 100, false),
		true,
		false)

	if err := app.SetRoot(pages, true).SetFocus(pages).Run(); err != nil {
		panic(err)
	}
}

@rivo commented on GitHub (Apr 15, 2022): This is an open source project. You're free to contribute examples if you find that they will improve the documentation. If you want to contribute to the Wiki https://github.com/rivo/tview/wiki, feel free to submit Markdown code in an issue. Regarding your code, there are a bunch of issues. For example, you're not resizing the `Pages` component to full-screen so the `minWidth` cutoff of `100` will cause two grid boxes to disappear. Also, some of your components in your grid are overlapping. And finally, functions such as `SetTitle()` or `SetBorder()` will return a `Box` and not a `List` so only a box will be drawn. Here's the same code with some fixes: ```go package main import ( "github.com/rivo/tview" ) var ( app *tview.Application pages *tview.Pages finderFocus tview.Primitive ) const eula = `Sample text. ` func main() { app := tview.NewApplication() pages := tview.NewPages() values := tview.NewList(). //column 2 ShowSecondaryText(true) values.SetTitle("Parameters") parameters := tview.NewList(). //column 1 ShowSecondaryText(true). AddItem("1", "Example", 1, nil). AddItem("2", "Example", 2, nil). AddItem("3", "Example", 3, nil). AddItem("4", "Example", 4, nil). AddItem("5", "Example", 'q', func() { app.Stop() }). SetSelectedFunc(func(i int, s1, s2 string, r rune) { // values.Clear() - //undefined (type *tview.Box has no field or method Clear), WHY??? }) parameters.SetBorder(true).SetTitle("Category") newPrimitive := func(text string) tview.Primitive { return tview.NewTextView(). SetTextAlign(tview.AlignCenter). SetText(text) } pages.AddPage("eula", tview.NewModal(). SetText(eula). AddButtons([]string{"Exit", "Next"}). SetDoneFunc(func(buttonIndex int, buttonLabel string) { if buttonIndex == 0 { app.Stop() } else { pages.SwitchToPage("setup") //app.Stop() } }), false, true) pages.AddPage("setup", tview.NewGrid(). SetRows(3, 0, 3). SetColumns(30, 0). SetBorders(true). AddItem(newPrimitive("Header"), 0, 0, 1, 3, 0, 0, false). AddItem(newPrimitive("Footer"), 2, 0, 1, 3, 0, 0, false). //// Layout for screens narrower than 100 cells (menu and side bar are hidden). //AddItem(parameters, 0, 0, 0, 0, 0, 0, false). //AddItem(values, 1, 0, 1, 3, 0, 0, false). // Layout for screens wider than 100 cells. AddItem(parameters, 1, 0, 1, 1, 0, 100, true). AddItem(values, 1, 1, 1, 2, 0, 100, false), true, false) if err := app.SetRoot(pages, true).SetFocus(pages).Run(); err != nil { panic(err) } } ```