ABOUT the ListView/ListItem. [Design a File eXplorer]

[Lenbot-QC]

Well, I am ready to create a file explorer and it's set in ### Textual. =_+
However, I am a troublemaker maybe, I cannot handle this issue: when I select a ListItem, then how to refresh the ListView accordingly?
For example, CWD='C:\', I need to jump to 'C:\Windows\', but the list cannot be changed when I press 'Windows'.

class dirtree(Container):
    init = 'C:\\'
    oldpath = init
    newpath = ''
    nowpath = ''
    dirlist = os.listdir(init)

    def compose(self) -> ComposeResult:
        self.widget1 = ListView(
            ListItem(Static('../')),
            *[ListItem(Static(f' {n}', id='item')) for n in self.dirlist]
        )
        yield self.widget1

    def on_list_view_selected(self, message: ListView.Selected) -> None:
        idx = self.widget1.index
        if idx:
            try:
                self.newpath = self.dirlist[idx-1]
                self.nowpath = self.oldpath + self.newpath + '\\'
                self.dirlist = os.listdir(self.nowpath)
                self.oldpath = self.nowpath
                pass    # I want to use here to refresh the ListView, maybe.
            except Exception as e:
                raise e

By the way, I have used 'on_list_view_selected', so I can succeed to get the current index of the ListView, and found that I can get the absolute path successfully. How I know, oh well, I debug here.
I just cannot refresh the ListView only. (Maybe this question can solve easily?)

[Lenbot-QC]

Oh, I know 'DirectoryTree', but I have designed the layout and found that tree is not friendly, so 'DirectoryTree' has been given up.
What I am doing now? I am reading #1840 and costing time to try.

def tears_of_joy(self) -> str:
    return 'what_the_hell'

[davep]

when I select a ListItem, then how to refresh the ListView accordingly?

The ListVIew has both clear and append methods, so I'd probably build such a widget around that. By way of illustration, here's how I think I'd approach what you seem to be doing:

from pathlib import Path
from typing  import Any

from textual.app     import App, ComposeResult
from textual.widgets import Header, Footer, ListView, ListItem, Label

class FSEntry( ListItem ):

    def __init__( self, entry: Path ) -> None:
        super().__init__()
        self.entry = entry

    def compose( self ) -> ComposeResult:
        yield Label(
            self.entry.stem + ( "/" if self.entry.is_dir() else "" )
        )


class FSBrowser( ListView ):

    def __init__( self, cwd: Path | None = None, *args: Any, **kwargs: Any ) -> None:
        super().__init__( *args, **kwargs )
        self._cwd = ( cwd if cwd is not None else Path( "." ) ).resolve()

    def on_mount( self ) -> None:
        self._refresh()

    def _refresh( self ) -> None:
        # Clear out anything that's in here right now.
        self.clear()
        # Now populate with the content of the current working directory. We
        # want to be able to go up, so let's make sure there's an entry for
        # that...
        self.append( FSEntry( Path( ".." ) ) )
        # ...and then add everything else we find in the directory.
        for entry in self._cwd.iterdir():
            self.append( FSEntry( entry ) )

    def on_list_view_selected( self, event: ListView.Selected ) -> None:
        # If the user selected a directory entry...
        if event.item.entry.is_dir():
            # ...repopulate with its content.
            self._cwd = event.item.entry
            self._refresh()
        else:
            # If it's not a directory then it's a file or some sort of
            # file-like entry in the filesystem; handling of that would
            # happen here.
            pass


class FSBrowserApp( App[ None ] ):

    def compose( self ) -> ComposeResult:
        yield Header()
        yield FSBrowser()
        yield Footer()

if __name__ == "__main__":
    FSBrowserApp().run()

[Lenbot-QC]

WOW! This method! Very awesome. I try it and it works well. Thanks davep :-]
So here are the little stories I have met. @v@

Though this method can solve my question, I find that - it's vital to optimize when I try to load a folder which has many files or folders.
Here is an example:

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

class prog(App):
    def compose(self) -> ComposeResult:
        yield ListView(*[ListItem(Static('%04d' % n)) for n in range(1000)])
        yield ListView(ListItem(Static('Done.')))

if __name__ == '__main__':
    prog().run()

Well, it runs successfully, and... it needs to load about 10 seconds (What???), and when the mouse selects or even hovers on the ListItem, it would cost about 2 seconds to make response. If "1000" becomes "4320" (Path "C:\Windows\System32" has about 120 folders and about 4200 files), the prog can be extremely slow! By the way, my computer's CPU is intel Core i5-11320H.

At the first time I make doubt on the ListView which contains 1000 ListItems. So I debug "compose", oh, both ListViews can load really fast, and after them, the prog will run several seconds within sense.

And then? Oh, I might have nothing to doubt now. @v@
So how I optimize? Well, when I face this difficult, I'd like to sort or make paginations to handle. Of course, the method what you show has been accepted already, I have a crush on it! ^o^

Why do I continue? Eeeh, I can accept that if the ListView contains less than 200 ListItems, and I think it's enough for me.

[willmcgugan]

Have you tried this with the latest Textual?

[davep]

Well, it runs successfully, and... it needs to load about 10 seconds (What???)

The core issue here is that ListView isn't really a great choice to show huge lists, as every item within it will be at least 2 widgets. So for your directory of 4320 entries, your app suddenly has to handle 8641 widgets (one for the ListView, 4320 ListItems and 4320 Labels; that's a lot of widgets).

This is where the DirectoryTree is a good choice, for example: it is based of Tree which, no matter how much content it has, it is only the one widget.

At some point in the future we may have a version of a ListView that is a lot leaner, only needing one widget no matter how much content there is, which might be a good choice for what you're truing to do here; the current ListView is better aimed at something that has 10s of items and where each item might be quite rich in its content (a ListItem can contain all sorts of widgets).

[marcbelmont]

@Lenbot-QC I'm interested in building a replacement for https://github.com/ranger/ranger/ using textual. Do you have a similar goal? I would be happy to help.