pythontextual

Getting the value of a ListItem/ListView in Textualize/Textual


I am struggling with something that I can't help but feel is very basic.

I am using the Textual framework, with python, and am having difficulty getting the Selected value from a ListItem.

In the code below, I have the ListView.Selected and i would like that to appear in the 2nd vertical, but i can't seem to access the value of that: event.item, event.item.value nothing seems to give me access to the value (as a string) of that event.

from textual.app import App, ComposeResult
from textual.widgets import ListView, ListItem, Label, Footer, Static
from textual.containers import Horizontal, Vertical

articles = ['dog', 'cat', 'piano']

class Reader(App):
    BINDINGS = [
        ("f", "toggle_files", "Toggle Files"),
        ("q", "quit", "Quit"),
    ]
    def createListItem(items):
        listItems = []
        for item in items:
            listItems.append(ListItem(Label(item)))
        return listItems

    listItems = createListItem(articles)

    def compose(self) -> ComposeResult:
        with Horizontal():
            with Vertical(classes="column"):
                yield ListView(
                    *self.listItems,
                    id='Foo',
                )
            with Vertical(classes="column", id='read-pane'):
                yield Static(id='read-panel')
        yield Footer()

    def on_mount(self) -> None:
        self.screen.styles.background = "darkblue"

    def on_list_view_selected( self, event: ListView.Selected ) -> None: 
        """Called when the user click a file in the ListView.
        https://github.com/Textualize/textual/blob/main/examples/code_browser.py
        """
        reader_view = self.query_one("#read-panel", Static)
        print(event.item)
        reader_view.update(event.item)
if __name__ == "__main__":
    app = Reader()
    app.run()

Solution

  • The actual ListView itself doesn't contain any information. According to a thread on this exact issue, you will need to construct your own list of whatever information you are trying to retrieve when that item is highlighted. In the example below, it's three labels that make up a ListView. I believe when you generate your ListView, that your Labels are buried pretty far inside of ListItems. Maybe try simplifying your list generation to look more similar to the github so there aren't so many containers to get to your labels.

    https://github.com/Textualize/textual/discussions/1840