[GH-ISSUE #57] less borders #41

Closed
opened 2026-03-04 01:01:20 +03:00 by kerem · 9 comments
Owner

Originally created by @vendelin8 on GitHub (Feb 16, 2018).
Original GitHub issue: https://github.com/rivo/tview/issues/57

Hi,

First of all, thanks for this awesome project. I wanted to write something similar 6 months ago, but I didn't have the time. But I'd be glad to contribute to your project if you don't mind.

So, my first suggestion is: the possibility to use less borders for primitives. Let's say, the top border is a must, since it has the title on it, but bottom border doesn't look as important to me. Neither one of the side borders; two borders can identify a Primitive, and it uses less space on the screen. So there could be an optional setting for the global space like:

type MissingBorders int

const (
	AllBorders MissingBorders = iota //default
	NoBottomBorder
	NoBottomLeftBorder
	NoBottomRightBorder
)

What do you think? I'd write it if you accept the idea.

Originally created by @vendelin8 on GitHub (Feb 16, 2018). Original GitHub issue: https://github.com/rivo/tview/issues/57 Hi, First of all, thanks for this awesome project. I wanted to write something similar 6 months ago, but I didn't have the time. But I'd be glad to contribute to your project if you don't mind. So, my first suggestion is: the possibility to use less borders for primitives. Let's say, the top border is a must, since it has the title on it, but bottom border doesn't look as important to me. Neither one of the side borders; two borders can identify a Primitive, and it uses less space on the screen. So there could be an optional setting for the global space like: ``` type MissingBorders int const ( AllBorders MissingBorders = iota //default NoBottomBorder NoBottomLeftBorder NoBottomRightBorder ) ``` What do you think? I'd write it if you accept the idea.
kerem closed this issue 2026-03-04 01:01:20 +03:00
Author
Owner

@rivo commented on GitHub (Feb 16, 2018):

Hi,

Thank you for your suggestion. I'm trying to understand what exactly you're looking for. For example, what would be the difference between NoBottomLeftBorder and NoLeftBorder? Would there actually be a situation where you'd want a left border but no right border?

Maybe you can create screenshots of the different types of borders you'd like and post them in this issue. It would help clarify what exactly you're missing at the moment.

Thanks!

<!-- gh-comment-id:366215330 --> @rivo commented on GitHub (Feb 16, 2018): Hi, Thank you for your suggestion. I'm trying to understand what exactly you're looking for. For example, what would be the difference between `NoBottomLeftBorder` and `NoLeftBorder`? Would there actually be a situation where you'd want a left border but no right border? Maybe you can create screenshots of the different types of borders you'd like and post them in this issue. It would help clarify what exactly you're missing at the moment. Thanks!
Author
Owner

@vendelin8 commented on GitHub (Feb 16, 2018):

Okay, basically I'm saying, that one border between two Primitives may be enough for separating them. I didn't suggest NoLeftBorder, because there is much less vertical dimension in a typical terminal, so having a border on top and bottom feels like taking a lot of lines, but having the same with the sides are not. But you're right, it may be added as well. Or just NoBottomLeftBorder and NoBottomRightBorder, which would simpler, but perfect for the case that someone doesn't want so much borders on the screen.

so I'm thinking about visually something like this:

---Some title---+---Other title---+
                |                 |
  Some Content  |  Other Content  |
                |                 |
------------More title------------+
                                  |
            More content          |
                                  |

In this case borders are only on the top and right side.

<!-- gh-comment-id:366225680 --> @vendelin8 commented on GitHub (Feb 16, 2018): Okay, basically I'm saying, that one border between two Primitives may be enough for separating them. I didn't suggest `NoLeftBorder`, because there is much less vertical dimension in a typical terminal, so having a border on top and bottom feels like taking a lot of lines, but having the same with the sides are not. But you're right, it may be added as well. Or just `NoBottomLeftBorder` and `NoBottomRightBorder`, which would simpler, but perfect for the case that someone doesn't want so much borders on the screen. so I'm thinking about visually something like this: ``` ---Some title---+---Other title---+ | | Some Content | Other Content | | | ------------More title------------+ | More content | | ``` In this case borders are only on the top and right side.
Author
Owner

@rivo commented on GitHub (Feb 17, 2018):

I understand. The problem with this, however, is that because I'm not working with pure ASCII characters (like -, +, and |) but with UTF-8 box drawing characters, you'll get unwanted artifacts. If you consider primitives in isolation and just remove individual borders, you will end up with something like this:

image

This does not look good.

The good news is that I'm currently working on a grid-based layout (check out the grid branch) where you will have a borders flag (similar to the Table class). When set, the Grid class will draw lines between the contained primitives, just as you are suggesting, and the joints will be correct. The only difference will be that the titles won't be part of the grid. But maybe I can find a separate solution for that.

Do you know what I mean? Let me know what you think about that.

<!-- gh-comment-id:366467786 --> @rivo commented on GitHub (Feb 17, 2018): I understand. The problem with this, however, is that because I'm not working with pure ASCII characters (like `-`, `+`, and `|`) but with UTF-8 box drawing characters, you'll get unwanted artifacts. If you consider primitives in isolation and just remove individual borders, you will end up with something like this: ![image](https://user-images.githubusercontent.com/480930/36345001-7619ec30-1423-11e8-9424-a24a427c9686.png) This does not look good. The good news is that I'm currently working on a grid-based layout (check out the [grid branch](https://github.com/rivo/tview/blob/grid/grid.go)) where you will have a `borders` flag (similar to the `Table` class). When set, the `Grid` class will draw lines between the contained primitives, just as you are suggesting, and the joints will be correct. The only difference will be that the titles won't be part of the grid. But maybe I can find a separate solution for that. Do you know what I mean? Let me know what you think about that.
Author
Owner

@vendelin8 commented on GitHub (Feb 17, 2018):

Yes, I got that. My point is, if this attribute is set globally, all Primitives would have only 2 borders, not just in the middle. So eg. the Primitives on the bottom wouldn't have bottom borders either.

I reformatted my drawing with box drawing characters, here:

───Some title───┐───Other title───┐
                │                 │
  Some Content  │  Other Content  │
                │                 │
────────────More title────────────┐
                                  │
            More content          │
                                  │

This case it's clearly defined, which borders are for which Primitive, and it doesn't look bad at all (at least for me). What do you think?

I got the idea of the grid layout, but I would prefer this one. Mostly because of the missing title, and the fact, that a grid is like a table with (mostly) fixed rows and columns.

Anyway, the whole thing is not that important, so if you don't like it, just leave it, and close the issue.

<!-- gh-comment-id:366470246 --> @vendelin8 commented on GitHub (Feb 17, 2018): Yes, I got that. My point is, if this attribute is set globally, all Primitives would have only 2 borders, not just in the middle. So eg. the Primitives on the bottom wouldn't have bottom borders either. I reformatted my drawing with box drawing characters, here: ``` ───Some title───┐───Other title───┐ │ │ Some Content │ Other Content │ │ │ ────────────More title────────────┐ │ More content │ │ ``` This case it's clearly defined, which borders are for which Primitive, and it doesn't look bad at all (at least for me). What do you think? I got the idea of the grid layout, but I would prefer this one. Mostly because of the missing title, and the fact, that a grid is like a table with (mostly) fixed rows and columns. Anyway, the whole thing is not that important, so if you don't like it, just leave it, and close the issue.
Author
Owner

@rivo commented on GitHub (Feb 18, 2018):

Well, at least your example would be possible to create with Grid as primitives will be allowed to span multiple rows and columns (and row/column sizes will be flexible). And for the titles, I'm thinking of adding something like an outside flag which will then print the title one row higher (thus into the grid, like in your example).

Personally, I think disconnected / improperly joined lines look bad so I'm a bit reluctant to offer this out of the box. But if you're laying out your primitives yourself instead of using Flex (or Grid in the future), you can actually create this exact example:

topLeftBox.SetRect(-1,0,20,5)
topRightBox.SetRect(18,0,20,5)
bottomBox.SetRect(-1,4,38,5)

Using Pages, you can control the order in which they are drawn so the bottom box is drawn last.

How about I leave this issue open and we'll revisit this when I have Grid finished (which should be soon)?

<!-- gh-comment-id:366508543 --> @rivo commented on GitHub (Feb 18, 2018): Well, at least your example would be possible to create with `Grid` as primitives will be allowed to span multiple rows and columns (and row/column sizes will be flexible). And for the titles, I'm thinking of adding something like an `outside` flag which will then print the title one row higher (thus into the grid, like in your example). Personally, I think disconnected / improperly joined lines look bad so I'm a bit reluctant to offer this out of the box. But if you're laying out your primitives yourself instead of using `Flex` (or `Grid` in the future), you can actually create this exact example: ```go topLeftBox.SetRect(-1,0,20,5) topRightBox.SetRect(18,0,20,5) bottomBox.SetRect(-1,4,38,5) ``` Using `Pages`, you can control the order in which they are drawn so the bottom box is drawn last. How about I leave this issue open and we'll revisit this when I have `Grid` finished (which should be soon)?
Author
Owner

@vendelin8 commented on GitHub (Feb 20, 2018):

I was thinking about it thoroughly, and I think, setting an arbitrary boundary for a Primitive is pretty much a hack. Even if it already exists for some reason.

I prefer layouting, on the other hand. I understand, that you don't like my idea, but for me, it's more like a style, that can be turned on or off, based on the user who uses it.

What would be a little between these two is having a flag, that if a grid cell contains one Primitive only, it writes it's title in the top line. I wouldn't use it, because I don't really like the style of a Grid around my Primitives, but it sounds much less hacky, than arbitrary Primitive border changes.

<!-- gh-comment-id:367125889 --> @vendelin8 commented on GitHub (Feb 20, 2018): I was thinking about it thoroughly, and I think, setting an arbitrary boundary for a Primitive is pretty much a hack. Even if it already exists for some reason. I prefer layouting, on the other hand. I understand, that you don't like my idea, but for me, it's more like a style, that can be turned on or off, based on the user who uses it. What would be a little between these two is having a flag, that if a grid cell contains one Primitive only, it writes it's title in the top line. I wouldn't use it, because I don't really like the style of a Grid around my Primitives, but it sounds much less hacky, than arbitrary Primitive border changes.
Author
Owner

@rivo commented on GitHub (Feb 21, 2018):

What would be a little between these two is having a flag, that if a grid cell contains one Primitive only, it writes it's title in the top line. I wouldn't use it, because I don't really like the style of a Grid around my Primitives, but it sounds much less hacky, than arbitrary Primitive border changes.

This is what I was going to offer you. Something like SetTitlePlacement(outside bool). But if you won't be using it anyway, I'm not sure I should add that.

Another thing I could think of is exposing the screen object like in #59 but on a primitive level. Then you could make your borders look any way you want. But of course, it would require you to do some drawing yourself. With the various Print functions, this shouldn't be too hard, though.

<!-- gh-comment-id:367384828 --> @rivo commented on GitHub (Feb 21, 2018): > What would be a little between these two is having a flag, that if a grid cell contains one Primitive only, it writes it's title in the top line. I wouldn't use it, because I don't really like the style of a Grid around my Primitives, but it sounds much less hacky, than arbitrary Primitive border changes. This is what I was going to offer you. Something like `SetTitlePlacement(outside bool)`. But if you won't be using it anyway, I'm not sure I should add that. Another thing I could think of is exposing the `screen` object like in #59 but on a primitive level. Then you could make your borders look any way you want. But of course, it would require you to do some drawing yourself. With the various `Print` functions, this shouldn't be too hard, though.
Author
Owner

@vendelin8 commented on GitHub (Feb 22, 2018):

Ok, sounds acceptable.

<!-- gh-comment-id:367621038 --> @vendelin8 commented on GitHub (Feb 22, 2018): Ok, sounds acceptable.
Author
Owner

@rivo commented on GitHub (Feb 22, 2018):

You got it. Check out SetDrawFunc().

Note that this is not a global style. But if you create your own NewPrimitive() function, it should behave similarly.

<!-- gh-comment-id:367654500 --> @rivo commented on GitHub (Feb 22, 2018): You got it. Check out [`SetDrawFunc()`](https://godoc.org/github.com/rivo/tview#Box.SetDrawFunc). Note that this is not a global style. But if you create your own `NewPrimitive()` function, it should behave similarly.
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#41
No description provided.