Dynamically adjust width? What's the right layout for what I want to do?

[tearfulnumpty]

I've got a basic proof of concept of the following:

siv.add_layer(
        Dialog::new()
                .title("my_title")
                .button("Ok", |s| s.quit())
                .content(
                    ListView::new()
                        .child("my_other_title", EditView::new().content(my_content)
                            .with_name("my_other_title")
                            .min_width(60))
        ),
 );

With several more similar children in a vertical list. I built it around the ListView example: https://github.com/gyscos/cursive/blob/main/cursive/examples/list_view.rs

This does indeed work fine, but I preferably want to do two other things:

1. I want to dynamically increase the width as available and as required. Specifically, I want to increase the width of my items when the text in my EditView boxes becomes larger than the minimum, but obviously only when space is available inside of the terminal. That way the minimum size TUI value would be respected, but it would grow with text as appropriate.
2. Preferably, I'd like to also have a second vertical column beside this one, where I simply have a box of text displayed, probably a TextView.

How should I approach this? I wasn't able to find any examples or documentation which talk about this. Thanks!

[gyscos]

Hi, and thanks for the report!

Indeed, EditView was apparently missing its required_size implementation, so it would not adapt to its content. This should now be fixed, and your example should now work as expected without modification. You can try using the git version of cursive-core to confirm.

[tearfulnumpty]

Thanks! I'll be sure to try the git version out in a little bit. Will this fix be making its way to a new release in the near future?

How could I implement the additional vertical column in the easiest way? Would I just want to add a second ListView or look for something like a FixedLayout? Is there an example to follow?

[gyscos]

We don't currently have a generic Grid of Table view, where you could set an extra column with rows that match the other columns.

There are currently 2 main workarounds:

• Have a vertical LinearLayout or ListView of rows, where each row is a horizontal LinearLayout with 2 (or more) columns.
  • Pro: Easy to define both columns of each row together.
  • Con: The width of each column will not be matched for all rows, so it might not look like a true extra column.
  • Workaround: You could try to right-align the text in the extra column of each row, it might end up looking better.
    Alternatively, I could also look into "linking" the width of multiple views, so you could ensure the first column of each row has the same width. Might be doable with a special view wrapper.
• Have a top-level horizontal LinarLayout of two columns, where each is a vertical LinearLayout or ListView.
  • Pro: Columns are neatly aligned
  • Con: If some rows in one column take multiple lines, you need to make sure the same rows in the other columns also take the same height, or the rows will not be aligned.
  • Workaround: If all your rows are 1-line high, it's easier to keep that in sync.