Feature Request: Adding subtext to the TreeView

[coquizen]

How trivial is it to add subtext to the TreeView? The use case for this would be to display a comment tree from a blog with its respective replies indented to align with its node. I have already started an attempt to add this functionality but struggling to understand how the TreeView is rendered. Can you walk me through the code? (I am a beginner at this and would like to contribute).

The following is an example of what I mean:

| Title of Comment
| Body of Comment
|└──title of reply
| body of reply
| └──title of reply
| Body of reply

Is this a matter of tweaking current code or does it require a rewrite? On my fork of your project I have already written some code to this effect. Great project btw!
[EDITED: for clarification of use case. Ignore the the leading '|' as it was used to maintain alignment.]
[EDITED2: See below for clarification as github automatically removes empty spaces]

[Bios-Marcel]

Hey, I'd like to clarify what you mean. Do you mean that you want a tree hierarchy where the nodes support multiline text? Because the example that you have shown us simply looks like a normal treeview.
And why does it need to be a treeview anyway?

[coquizen]

My intention with treeview is to adapt it such that the subtext can be multi-lined and properly aligned with the title text. The use case would be for showing comments with its meta data as its title text and the body of the comment as its subtext. Their replies would be subtreenodes of its parent with the functionality of folding each node as before. An added feature would be a setting where the subtext could be folded as well.

…

-- Ian G Canino Telegram: telegram.me/iangadev eMail: ian.canino@gmail.com

On Feb 23, 2019, 5:48 PM -0500, Marcel Schramm ***@***.***>, wrote: Hey, I'd like to clarify what you mean. Do you mean that you want a tree hierarchy where the nodes support multiline text? Because the example that you have shown us simply looks like a normal treeview. And why does it need to be a treeview anyway? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

[Bios-Marcel]

I dont think you need this. Just use a Textview and regions + highlights if you need a selection. Adding such features to the treeview doesnt seem like the way to go.

[coquizen]

Alternatively have tree view support multilie text via respecting '\n' code.

My understanding of regions and highlight in the library is that it affects the styling and ability to tag internally. Not the alignment which is at the core of the feature request.

[Bios-Marcel]

Oh right, you want it to break the lines AND have indentation as well. Then I have no better idea :)

[rivo]

When you look at the presentation demo, on page 9, the various features of the TreeView are shown. Maintaining support for these features while adding variable-height nodes will be a major effort. Even worse will be making line breaks work (automatic as well as forced). I've refactored TextView multiple times to make line breaks work properly with all the edge cases (as well as all the issues that come with unicode characters). I don't see this happening any time soon on TreeView.

Two solutions come to mind here: If you insist on the lines that TreeView draws, I would suggest keeping the nodes on one line and showing a preview of your comment texts in them. Maybe like this:

When the user navigates to one of the lines, you could show the full text in a second window.

The second idea would be to not use TreeView but instead use a Grid layout. I coded up a small example:

package main

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

func main() {
	newTextView := func() *tview.TextView {
		textView := tview.NewTextView().
			SetText("[yellow]Subject of comment\n[white]First line\nsecond line\nthird line").
			SetDynamicColors(true)
		textView.SetBorder(true).SetBorderColor(tcell.ColorBlue)
		return textView
	}
	grid := tview.NewGrid().SetColumns(5, 5, 5, 5, 0).SetRows(5, 5, 5, 5, 5, 5, 5, 5, 5)
	grid.AddItem(newTextView(), 0, 0, 1, 5, 0, 0, false)
	grid.AddItem(newTextView(), 1, 1, 1, 4, 0, 0, false)
	grid.AddItem(newTextView(), 2, 1, 1, 4, 0, 0, false)
	grid.AddItem(newTextView(), 3, 0, 1, 5, 0, 0, false)
	grid.AddItem(newTextView(), 4, 1, 1, 4, 0, 0, false)
	grid.AddItem(newTextView(), 5, 2, 1, 3, 0, 0, false)
	grid.AddItem(newTextView(), 6, 2, 1, 3, 0, 0, false)
	grid.AddItem(newTextView(), 7, 1, 1, 4, 0, 0, false)
	if err := tview.NewApplication().SetRoot(grid, true).Run(); err != nil {
		panic(err)
	}
}

Of course, you wouldn't hardcode it like this. And maybe you don't want the borders around the comments. Thirdly, you may need two render passes if you want the height of the comments to adapt to the number of lines in the comments (tview does not calculate layouts bottom-up but top-down). But like this, it would be possible to show a hierarchy (no lines, though, unless you want to draw them yourself).

Let me know if this helps you a bit.