starred/tview

Fork 0

mirror of https://github.com/rivo/tview.git synced 2026-04-26 13:25:51 +03:00

[GH-ISSUE #156] Question: Add modal box when having a flex & other minor things #126

New issue

Closed

opened 2026-03-04 01:02:10 +03:00 by kerem · 3 comments

kerem commented

2026-03-04 01:02:10 +03:00

Owner

Originally created by @dragonquest on GitHub (Aug 16, 2018).
Original GitHub issue: https://github.com/rivo/tview/issues/156

Hey

I'm building my CUI based on the flex element. My question is how do I show a "child view" / aka modal box? or my own primitive?

Also I have created an editable Inputbox (POC) and I want to add it to the Form element, how do I do that? Plus, is there a way to dynamically add / remove element from the form element? I can't see any exposed methods... (I know there does exist an Add & Remove Item; but how can I get all the items in a flex element?)

Whats the equivalent of gocui's layout facility? I guess pages?

Thank you a lot

Originally created by @dragonquest on GitHub (Aug 16, 2018). Original GitHub issue: https://github.com/rivo/tview/issues/156 Hey I'm building my CUI based on the flex element. My question is how do I show a "child view" / aka modal box? or my own primitive? Also I have created an editable Inputbox (POC) and I want to add it to the Form element, how do I do that? Plus, is there a way to dynamically add / remove element from the form element? I can't see any exposed methods... (I know there does exist an Add & Remove Item; but how can I get all the items in a flex element?) Whats the equivalent of gocui's layout facility? I guess pages? Thank you a lot

kerem closed this issue

2026-03-04 01:02:11 +03:00

kerem commented

2026-03-04 01:02:11 +03:00

Author

Owner

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

I'm building my CUI based on the flex element. My question is how do I show a "child view" / aka modal box? or my own primitive?

With the Flex layout cannot create overlapping elements. That's what Pages is for, use it to put a primitive on top of another. You'll find information about modals in the wiki. It also demonstrates how you can center your primitive on the screen.

I have created an editable Inputbox (POC)

How does this differ from InputField? Did you write your own new primitive?

I want to add it to the Form element, how do I do that?

You'll need your primitive to implement the FormItem interface. You can then use AddFormItem() to add it to a form.

Plus, is there a way to dynamically add / remove element from the form element?

how can I get all the items in a flex element?

I'm not sure now if you want to add/remove elements to/from a Form or to/from a Flex object. Can you clarify?

Whats the equivalent of gocui's layout facility? I guess pages?

Pages allows you to place one or more overlapping primitives on the screen and set their visibility as needed. I'm not exactly sure what you're referring to regarding gocui's "layout facility". Let me know what you'd like to achieve and maybe I can help you find a solution.

@rivo commented on GitHub (Aug 17, 2018): > I'm building my CUI based on the flex element. My question is how do I show a "child view" / aka modal box? or my own primitive? With the `Flex` layout cannot create overlapping elements. That's what `Pages` is for, use it to put a primitive on top of another. You'll find information about modals in the [wiki](https://github.com/rivo/tview/wiki/Modal). It also demonstrates how you can center your primitive on the screen. > I have created an editable Inputbox (POC) How does this differ from `InputField`? Did you write your own new primitive? > I want to add it to the Form element, how do I do that? You'll need your primitive to implement the [`FormItem`](https://godoc.org/github.com/rivo/tview#FormItem) interface. You can then use [`AddFormItem()`](https://godoc.org/github.com/rivo/tview#Form.AddFormItem) to add it to a form. > Plus, is there a way to dynamically add / remove element from the form element? > how can I get all the items in a flex element? I'm not sure now if you want to add/remove elements to/from a `Form` or to/from a `Flex` object. Can you clarify? > Whats the equivalent of gocui's layout facility? I guess pages? `Pages` allows you to place one or more overlapping primitives on the screen and set their visibility as needed. I'm not exactly sure what you're referring to regarding `gocui`'s "layout facility". Let me know what you'd like to achieve and maybe I can help you find a solution.

kerem commented

2026-03-04 01:02:12 +03:00

Author

Owner

@dragonquest commented on GitHub (Aug 17, 2018):

Hey,

Flex
Thank you. I'll check that out again. I have actually abused the SetAfterDrawFunc and then I painted over my UI element and then set the focus to that element :D I created a MessageBox and this way I can simply quicky paint a MessageBox (using "modal" element).

Own InputField
I wanted to see how I can create my own Primitive and also, I wanted to have the cursor movable. At the moment my InputField has an "unlimited" internal buffer but you can only see what will be painted on the screen. The limitation I've found with the field is that you can only write and delete via backspace, that's why I wanted to create my own. I did not create a PR because it does not support labels and things like that. It's just a POC.

FormItem
Ok thanks

Dynamic add functionality
I would like to create a "help section" (pane) and it should be only visiable when toggled and it also should be dynamic. Example: if a user has the focus on the InputField then I want to show the user relevant help information, if he has focused the List then I want to show other help information.

@dragonquest commented on GitHub (Aug 17, 2018): Hey, **Flex** Thank you. I'll check that out again. I have actually abused the SetAfterDrawFunc and then I painted over my UI element and then set the focus to that element :D I created a MessageBox and this way I can simply quicky paint a MessageBox (using "modal" element). **Own InputField** I wanted to see how I can create my own Primitive and also, I wanted to have the cursor movable. At the moment my InputField has an "unlimited" internal buffer but you can only see what will be painted on the screen. The limitation I've found with the field is that you can only write and delete via backspace, that's why I wanted to create my own. I did not create a PR because it does not support labels and things like that. It's just a POC. **FormItem** Ok thanks **Dynamic add functionality** I would like to create a "help section" (pane) and it should be only visiable when toggled and it also should be dynamic. Example: if a user has the focus on the InputField then I want to show the user relevant help information, if he has focused the List then I want to show other help information.

kerem commented

2026-03-04 01:02:12 +03:00

Author

Owner

@rivo commented on GitHub (Sep 5, 2018):

Apologies for the late reply. I was busy but I haven't forgotten about this thread.

The limitation I've found with the field is that you can only write and delete via backspace, that's why I wanted to create my own.

Yeah, #103 should add better editing capabilities to InputField. I hope I'll be able to get to it soon.

I would like to create a "help section" (pane) and it should be only visiable when toggled and it also should be dynamic. Example: if a user has the focus on the InputField then I want to show the user relevant help information, if he has focused the List then I want to show other help information.

I believe this should be possible now already. It depends somewhat on how you want to display your help info. With Pages, you can simply toggle a primitive's visibility. With Flex, at the moment, you'll have to remove/add it. (Maybe Flex needs to be better in this respect, I have to think about that.)

I'm closing this for now. We can always reopen this issue if there are more open items.

@rivo commented on GitHub (Sep 5, 2018): Apologies for the late reply. I was busy but I haven't forgotten about this thread. > The limitation I've found with the field is that you can only write and delete via backspace, that's why I wanted to create my own. Yeah, #103 should add better editing capabilities to `InputField`. I hope I'll be able to get to it soon. > I would like to create a "help section" (pane) and it should be only visiable when toggled and it also should be dynamic. Example: if a user has the focus on the InputField then I want to show the user relevant help information, if he has focused the List then I want to show other help information. I believe this should be possible now already. It depends somewhat on how you want to display your help info. With `Pages`, you can simply toggle a primitive's visibility. With `Flex`, at the moment, you'll have to remove/add it. (Maybe `Flex` needs to be better in this respect, I have to think about that.) I'm closing this for now. We can always reopen this issue if there are more open items.

kerem referenced this issue

2026-03-04 01:08:16 +03:00

[PR #126] [MERGED] Refactored semigraphics and configurable borders #860