Layers and overlaying widgets.

[MaineTim]

I'm taking a poke at playing with layers, with the goal of being able to overlay an input widget with an a second input widget, and then remove the second revealing the first still intact. In a modified version of the layers example:

from textual.app import App, ComposeResult
from textual.widgets import Static


class LayersExample(App):
    CSS_PATH = "layers.css"

    BINDINGS = [
        ("t", "toggle", "")
    ]

    def compose(self) -> ComposeResult:
        yield Static("box2 (layer = below)", id="box2")

    def on_mount(self):
        self.widget_show = False

    def action_toggle(self):
        self.log("Toggled!")
        self.widget_show = False if self.widget_show else True
        if self.widget_show:
            self.mount(Static("box1 (layer = above)", id="box1"))
        else:
            self.query_one("#box1").remove()
            self.set_focus(self.query_one("#box2"))



if __name__ == "__main__":
    app = LayersExample()
    app.run()

and layers.css:

Screen {
    align: center middle;
    layers: below above;
}

Static {
    width: 28;
    height: 8;
    color: auto;
    content-align: center middle;
}

#box1 {
    layer: above;
    background: darkcyan;
}

#box2 {
    layer: below;
    background: orange;
}

When I run the program and hit T, box1 overlays box2 correctly. When I toggle again, box1 is removed from the DOM, but is still present on the screen. If I sweep the mouse back and forth across box1, it will disappear and box2 reappears. I guess I'm triggering a screen update by swiping the mouse across the now removed widget?

I also attempted this same idea using the the visibility attribute of the higher-layer widget rather than removing it completely, and it suffered from the same lack of an update.

How can I cause that update programmatically? Or am I just going about this the wrong way?

Thanks for any advice!

[davep]

Could you confirm what version of Textual you're doing this with? (the output of textual diagnose would be helpful).

I've just tested with 0.14.0 and it seemed to work just as you expected, but with v0.15.1 it doesn't seem to be behaving at all. As such, I'm going to create an issue from this discussion as I feel it needs looking into a bit further as a potential bug.

[MaineTim]

Thanks, @davep.

## Versions

| Name    | Value  |
|---------|--------|
| Textual | 0.15.1 |
| Rich    | 13.3.2 |

## Python

| Name           | Value                                                                  |
|----------------|------------------------------------------------------------------------|
| Version        | 3.11.2                                                                 |
| Implementation | CPython                                                                |
| Compiler       | GCC 12.2.1 20230124 [revision 193f7e62815b4089dfaed4c2bd34fd4f10209e27 |
| Executable     | /home/tim/Projects/media_browser/venv3112/bin/python3.11               |

## Operating System

| Name    | Value                                                         |
|---------|---------------------------------------------------------------|
| System  | Linux                                                         |
| Release | 6.2.1-1-default                                               |
| Version | #1 SMP PREEMPT_DYNAMIC Mon Feb 27 11:39:51 UTC 2023 (69e0e95) |

## Terminal

| Name                 | Value          |
|----------------------|----------------|
| Terminal Application | *Unknown*      |
| TERM                 | xterm-256color |
| COLORTERM            | truecolor      |
| FORCE_COLOR          | *Not set*      |
| NO_COLOR             | *Not set*      |

## Rich Console options

| Name           | Value                |
|----------------|----------------------|
| size           | width=180, height=35 |
| legacy_windows | False                |
| min_width      | 1                    |
| max_width      | 180                  |
| is_terminal    | True                 |
| encoding       | utf-8                |
| max_height     | 35                   |
| justify        | None                 |
| overflow       | None                 |
| no_wrap        | False                |
| highlight      | None                 |
| markup         | None                 |
| height         | None                 |

[MaineTim]

Another thing to note is if you give the lower layer box an offset (I just tried 1 1), it behaves as it should, but if you give the upper box an offset instead, it doesn't update.

[comalice]

For those reading later, I copied and pasted the example from the first post here and it works as intended.