gyscos / cursive

A Text User Interface library for the Rust programming language
MIT License
4.25k stars 244 forks source link

Padding for LinearLayout #117

Open marshauf opened 7 years ago

marshauf commented 7 years ago

Hello,

I would like to add a row between a PogressBar and a Button which are in a LinearLayout. I couldn't find a way to separate the two Views from each other. I would prefer to set a value like in a Dialog with padding. Can you add one or do I need to add a DummyView between the two to achieve my goal?

gyscos commented 7 years ago

Dummy views are there for this purpose.

Though I can understand it'd start to be annoying having to add one every time if you have a very long LinearView...

I'll look into that. Maybe it could also have optional borders...

dermetfan commented 6 years ago

TL;DR: How do I build a transparent DummyView?

I'm trying to visualize the keymap in my editor built on Cursive (using the new text styles - great work!).

Currently I position the keymap view below the editor using a LinearLayout:

LinearLayout::vertical()
    .child(view.with_id("inner")            .full_screen()) // main editor
    .child(Line::horizontal()               .full_width())  // delimiter
    .child(ListView::new().with_id("keymap").full_width())  // keymap
    .full_width()
    .with_id("overlay")

Resulting in (list is empty):

2018-05-20t14 21 30 435431908 02 00

However, since the cursor is always scrolled into view, the text scrolls when I fill the keymap view and the view size changes:

2018-05-20t14 21 39 050718751 02 00

I would like the keymap to behave like an overlay though, with no influence on the content behind it. The delimiter should also only be shown when the overlay is shown. So I wrapped everything in a StackView from which I can just pop off the overlay. To keep it at the bottom of the screen though, I need to add a DummyView that acts as spacer:

StackView::new()
    .fullscreen_layer(view.with_id("inner").full_screen()) // main editor
    .fullscreen_layer(LinearLayout::vertical()
        .child(cursive::views::DummyView        .full_screen()) // spacer
        .child(Line::horizontal()               .full_width())  // delimiter
        .child(ListView::new().with_id("keymap").full_width())  // keymap
        .full_width()
        .with_id("overlay")
    )

However, even though DummyView does nothing in draw(), the editor is not visible behind it:

2018-05-20t14 22 18 541359216 02 00

Do you have any tips on how I could achieve that layout?

gyscos commented 6 years ago

Hi!

DummyView is transparent, the problem is the layer itself. StackView wraps each child in a Layer which fills the background for this view, which is why layers are not transparent.

I'll run some tests, but it's possible we don't need that anymore. We can fill the background in Dialog, Panel and Layer, and let users compose from that.

Note that StackView currently only forwards events to the top view, so your editor may not receive any input while the overlay is visible.