[PR #991] [CLOSED] fix(grid): order of adding items should not affect drawing #1098

Closed
opened 2026-03-04 01:09:26 +03:00 by kerem · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/rivo/tview/pull/991
Author: @darylhjd
Created: 5/24/2024
Status: Closed

Base: masterHead: master


📝 Commits (1)

  • 8b81388 fix(grid): order of adding items should not affect drawing

📊 Changes

1 file changed (+5 additions, -5 deletions)

View changed files

📝 grid.go (+5 -5)

📄 Description

This PR is related to https://github.com/rivo/tview/issues/987

It seems that the order of adding items into the grid affects the result of the drawing.

This behaviour can be seen with the following example:

package main

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

func TestPage() {
	var dimensions []int
	for i := 0; i < 15; i++ {
		dimensions = append(dimensions, -1)
	}
	grid := tview.NewGrid().SetRows(dimensions...).SetColumns(dimensions...)
	// Set grid attributes
	grid.SetTitle("Manga Information").
		SetBorder(true)

	// Use a TextView for basic information of the manga.
	info := tview.NewTextView()
	// Set textview attributes
	info.SetWrap(true).SetWordWrap(true).
		SetTitle("About").
		SetBorder(true)

	// Use a table to show the chapters for the manga.
	table := tview.NewTable()
	// Set chapter headers
	numHeader := tview.NewTableCell("Chap").
		SetSelectable(false)
	titleHeader := tview.NewTableCell("Name").
		SetSelectable(false)
	downloadHeader := tview.NewTableCell("Download Status").
		SetSelectable(false)
	scanGroupHeader := tview.NewTableCell("ScanGroup").
		SetSelectable(false)
	readMarkerHeader := tview.NewTableCell("Read Status").
		SetSelectable(false)
	table.SetCell(0, 0, numHeader).
		SetCell(0, 1, titleHeader).
		SetCell(0, 2, downloadHeader).
		SetCell(0, 3, scanGroupHeader).
		SetCell(0, 4, readMarkerHeader).
		SetFixed(1, 0)
	// Set table attributes
	table.SetSelectable(true, false).
		SetSeparator('|').
		SetTitle("Chapters").
		SetBorder(true)

	// Add info and table to the grid. Set the focus to the chapter table.
	grid.AddItem(info, 0, 0, 5, 15, 0, 0, false).
		AddItem(table, 5, 0, 10, 15, 0, 0, true).
		AddItem(info, 0, 0, 15, 5, 0, 80, false).
		AddItem(table, 0, 5, 15, 10, 0, 80, true)

	if err := tview.NewApplication().SetRoot(grid, true).Run(); err != nil {
		panic(err)
	}
}

func main() {
	TestPage()
}

We expect the table to be shown differently based on the minimum widths and heights provided.
image
image

However, this is what we actually get - the table is shown twice in the large width view.
image
image

Strangely, if you change the order of adding of items to the grid, this unexpected behaviour disappears:

	// Change order of adding to this
	grid.AddItem(info, 0, 0, 5, 15, 0, 0, false). // Info now added together
		AddItem(info, 0, 0, 15, 5, 0, 80, false).
		AddItem(table, 5, 0, 10, 15, 0, 0, true). // Table now added together
		AddItem(table, 0, 5, 15, 10, 0, 80, true)
	
	// Previously, this was the order
	grid.AddItem(info, 0, 0, 5, 15, 0, 0, false).
		AddItem(table, 5, 0, 10, 15, 0, 0, true).
		AddItem(info, 0, 0, 15, 5, 0, 80, false).
		AddItem(table, 0, 5, 15, 10, 0, 80, true)

It seems that using a map fixes this. This was also the original data structure used before github.com/rivo/tview@33a1d271f2. No other logic is changed.


🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/rivo/tview/pull/991 **Author:** [@darylhjd](https://github.com/darylhjd) **Created:** 5/24/2024 **Status:** ❌ Closed **Base:** `master` ← **Head:** `master` --- ### 📝 Commits (1) - [`8b81388`](https://github.com/rivo/tview/commit/8b81388d2ae4093527ef426352cfc5d65b387413) fix(grid): order of adding items should not affect drawing ### 📊 Changes **1 file changed** (+5 additions, -5 deletions) <details> <summary>View changed files</summary> 📝 `grid.go` (+5 -5) </details> ### 📄 Description This PR is related to https://github.com/rivo/tview/issues/987 It seems that the order of adding items into the grid affects the result of the drawing. This behaviour can be seen with the following example: ```go package main import ( "github.com/rivo/tview" ) func TestPage() { var dimensions []int for i := 0; i < 15; i++ { dimensions = append(dimensions, -1) } grid := tview.NewGrid().SetRows(dimensions...).SetColumns(dimensions...) // Set grid attributes grid.SetTitle("Manga Information"). SetBorder(true) // Use a TextView for basic information of the manga. info := tview.NewTextView() // Set textview attributes info.SetWrap(true).SetWordWrap(true). SetTitle("About"). SetBorder(true) // Use a table to show the chapters for the manga. table := tview.NewTable() // Set chapter headers numHeader := tview.NewTableCell("Chap"). SetSelectable(false) titleHeader := tview.NewTableCell("Name"). SetSelectable(false) downloadHeader := tview.NewTableCell("Download Status"). SetSelectable(false) scanGroupHeader := tview.NewTableCell("ScanGroup"). SetSelectable(false) readMarkerHeader := tview.NewTableCell("Read Status"). SetSelectable(false) table.SetCell(0, 0, numHeader). SetCell(0, 1, titleHeader). SetCell(0, 2, downloadHeader). SetCell(0, 3, scanGroupHeader). SetCell(0, 4, readMarkerHeader). SetFixed(1, 0) // Set table attributes table.SetSelectable(true, false). SetSeparator('|'). SetTitle("Chapters"). SetBorder(true) // Add info and table to the grid. Set the focus to the chapter table. grid.AddItem(info, 0, 0, 5, 15, 0, 0, false). AddItem(table, 5, 0, 10, 15, 0, 0, true). AddItem(info, 0, 0, 15, 5, 0, 80, false). AddItem(table, 0, 5, 15, 10, 0, 80, true) if err := tview.NewApplication().SetRoot(grid, true).Run(); err != nil { panic(err) } } func main() { TestPage() } ``` We expect the table to be shown differently based on the minimum widths and heights provided. ![image](https://github.com/rivo/tview/assets/53652695/26652e31-a1f8-4ae4-a677-c1779c24e6ae) ![image](https://github.com/rivo/tview/assets/53652695/8ef42406-7fc0-4d95-95d9-7c71d615ee33) However, this is what we actually get - the table is shown twice in the large width view. ![image](https://github.com/rivo/tview/assets/53652695/384a67d3-8c7a-4d0b-9bb9-5a750c8e1ce8) ![image](https://github.com/rivo/tview/assets/53652695/8ef42406-7fc0-4d95-95d9-7c71d615ee33) Strangely, if you change the order of adding of items to the grid, this unexpected behaviour disappears: ```go // Change order of adding to this grid.AddItem(info, 0, 0, 5, 15, 0, 0, false). // Info now added together AddItem(info, 0, 0, 15, 5, 0, 80, false). AddItem(table, 5, 0, 10, 15, 0, 0, true). // Table now added together AddItem(table, 0, 5, 15, 10, 0, 80, true) // Previously, this was the order grid.AddItem(info, 0, 0, 5, 15, 0, 0, false). AddItem(table, 5, 0, 10, 15, 0, 0, true). AddItem(info, 0, 0, 15, 5, 0, 80, false). AddItem(table, 0, 5, 15, 10, 0, 80, true) ``` It seems that using a `map` fixes this. This was also the original data structure used before https://github.com/rivo/tview/commit/33a1d271f2b6bae5ef63606df05275c2c91b2f86. No other logic is changed. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
kerem 2026-03-04 01:09:26 +03:00
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/tview#1098
No description provided.