How to refresh a Selection widget

[Resonanz]

The code below adds a button and a selection widget. Pressing the button appends additional Selection items into the internal list as shown in the image. However the additional items don't appear in the Selection widget. Why is this? Do I need to call the refresh in a different way, or am I appending items in the incorrect way?

import toga
from toga.constants import COLUMN
from toga.style import Pack

def add_item(self):
    self.parent.children[1].items.append("New item for Selector")
    self.refresh()

class PumpApp(toga.App):
    def startup(self):
        self.main_window = toga.MainWindow(title=self.name, size=(1000, 500))
        toga_box = toga.Box("a box")

        toga_box.add(
            toga.Button(
                "Add items", 
                id="add_items", 
                style=Pack(padding=(10), width=200),
                
                # Call add_item to add item to Selector
                on_press=add_item
            )
        )

        toga_box.add(
            toga.Selection(
                id="my_selector",
                style = Pack(padding=(10), width=200),
                items=["Device 1", "Device 2", "Device 3"]
            )
        )

        toga_box.style = Pack(direction=COLUMN, padding=5)

        self.main_window.content = toga_box
        self.main_window.show()

def main():
    return PumpApp(
        "App",
        "com.website.www"
    )

if __name__ == "__main__":
    app = main()
    app.main_loop()

[freakboy3742]

As currently implemented, there's no explicit public API for "add a single item" or "refresh the item list". The current assumption is that the list of items is relatively static; you can re-assign the list of items on the widget, but manipulating the list of items won't be reflected.

As a result, the apparently no-op statement:
self.parent.children[1].items = self.parent.children[1].items

will actually fix the problem you're seeing, as you're explicitly using the .items setter, which triggers "add_item" logic on the widget.

A better construction would be to maintain the list of items you want as a separate list, and assign that list to the widget as .items whenever you want to update the display list.

Longer term, we intend to modify Selection to use a Source as the underlying list of items. This will provide the sort of APIs you're looking for where adding an item changes the list available for selection.

As an aside: two small critiques of/suggestions for the sample code you've provided:

1. self is only required as the first argument of methods that are members of a class, and by convention the existence of that argument is an indicator that the method is part of a class. In the example you've provided add_item isn't a member of class, and the first argument being passed to that handler is the widget being triggered by the action - the button - which is why you need to do the .parent.children[1] dance to get to the selection widget.
2. If add_item was made a member of the PumpApp class, you would then be able to make the toga.Selection() an attribute of the class (assigning to self.my_selector), and the handler would be able to reference self.my_selector directly, instead of needing to traverse the layout hierarchy.

[Resonanz]

Thanks a lot for the reply -- that was really helpful. I think I have re-factored the code per your suggestion (using a class attribute) and documented it in the following in case it helps others.

import toga
from toga.constants import COLUMN
from toga.style import Pack

class PumpApp(toga.App):

    # Update Selector using class attribute self.my_selector
    def add_item(self, *args):

        # Assigning a new list updates the list contents
        self.my_selector.items = ['Device 4', 'Device 5', 'Device 6']

    def startup(self):
        self.main_window = toga.MainWindow(title=self.name, size=(100, 50))
        toga_box = toga.Box("a box")

        toga_box.add(
            toga.Button(
                "Add items", 
                id="add_items", 
                style=Pack(padding=(10), width=200),
                
                # Call add_item to add item to Selector
                on_press=self.add_item
            )
        )

        # Add Selector, assigning it to a
        # class attribute (using self)
        self.my_selector = toga.Selection(
            id="my_sel",
            style = Pack(padding=(10), width=200),
            items=["Device 1", "Device 2", "Device 3"]
        )

        toga_box.add(self.my_selector)
        toga_box.style = Pack(direction=COLUMN, padding=5)

        self.main_window.content = toga_box
        self.main_window.show()

def main():
    # Some of the following will appear in
    # the app's About menu (Mac)
    return PumpApp(
        "App",
        "com.website.www"
    )

if __name__ == "__main__":
    app = main()
    app.main_loop()