Making a Dropdown List of Selectable Subjects

[jmdelahanty]

Hello everyone! I was looking into the GUI widgets some more for examples as I'm trying to learn some basic GUI design/programming. I've gotten kinda stuck understanding how this piece works. Namely, how to use the QListWidget in a simple way. I'm still pretty tripped up by metaclasses/class inheritance so I'm trying to keep it small.

I have a directory with a bunch of subjects in it. For our microscope stuff, it would be neat to have a window pop-up when the program started that lets you make a "flight manifest" of the subjects you plan on running that day. Since you can only run one mouse at a time, the list of subjects you select would just be a list that the program iterates through.

Getting a list of a directories' contents and then making those clickable objects is where I seem to have gotten stuck.

Any advice for how to do that part?

[sneakers-the-rat]

so you want to

• populate a list with possible subjects
• select some subset of them
• trigger some action based on the selected values

Typically the UI element you would use for multiple-selection from a list is a list of checkboxes, see an example here: https://github.com/pyside/pyside2-examples/blob/696f0677ea3c982344364f633845ed39b686cdb3/examples/widgets/widgets/groupbox.py

So you'd populate a layout with pairs of (QCheckBox, QLabel)s that let you check individual subjects, and then read the checked values when you want to use them. So a quick example.

from PySide2 import QtWidgets
from PySide2.QtWidgets import QCheckBox, QPushButton, QLabel, QGroupBox
from typing import List, Dict, Tuple, Optional

class CheckList(QtWidgets.QWidget):

    def __init__(self, subjects:List[str], title:str="Subjects", **kwargs):
        super(CheckList, self).__init__(**kwargs)
        self._checkboxes = {} # type: Dict[str, QCheckBox]
        self.title = title

        self.subjects = subjects
        self.layout = QtWidgets.QVBoxLayout()

        # Add checkboxes to layout
        self.layout.addWidget(self._init_checkboxes())
        # Add button to layout
        self.ok_button = QPushButton("OK")
        self.layout.addWidget(self.ok_button)

        # connect button to action triggered when clicked
        self.ok_button.clicked.connect(self.print_values)

        # set layout of main widget
        self.setLayout(self.layout)

    def value(self) -> Dict[str, bool]:
        return {
            sub: box.isChecked() for sub, box in self._checkboxes.items() 
        }


    def _init_checkboxes(self) -> QGroupBox:
        # Button groupbox
        check_group = QGroupBox(self.title)
        # button layout
        check_layout = QtWidgets.QVBoxLayout()
        
        # make checkboxes
        for subject in self.subjects:
            box = QCheckBox(subject)
            # add checkbox to layout so it's displayed
            check_layout.addWidget(box)
            # save reference to checkboxes to get value later
            self._checkboxes[subject] = box

        # set layout full of buttons for groupbox
        check_group.setLayout(check_layout)
        return check_group


    def print_values(self):
        print(self.value())


if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    subject = CheckList(subjects=[
        'subject 1', 'subject 2', 'subject 3']
        )
    subject.show()
    sys.exit(app.exec_())

Which looks like this:

and does this when you click 'ok'

So you don't want to build all the logic into one object, for example this one takes a generic list of strings, so you would want to do the loading of the list of subjects elsewhere (idk, like if they're files you'd just do Path.glob()).

Notice the different parts of that example: take in a list of strings, create GUI objects for the input, create a button, create a method for getting the value of the checkboxes, and then make a method that fires when the button is clicked. If i was intending on using this code i'd also put all the gui creation stuff in its own method rather than in __init__ so it could be overridden if needed by subclasses.

Don't overthink inheritance. It's as simple as

class ClassA:
    def class_a_method(self):
        print("I am a method defined in class A")
        
class ClassB(ClassA):

    def class_b_method(self):
        print("I am a method defined in class B")
        
class ClassC(ClassB):
    def class_a_method(self):
        print("I override class A's method in class C")
        

which works like this:

Classes that inherit from another class start out as "copies" of that class, and then allow you to extend or replace different methods or attributes. So you might want to have a generic Hardware class that defines some properties true of all hardware objects, then GPIO and Camera classes that inherit from it and define generic logic for GPIO or Camera classes, respectively, and then subclasses for specific GPIO objects or cameras that extend them further.

[jmdelahanty]

To make question more public instead of just twitter, I can't for the life of me capture the printing of this subject list! I've tried searching for a bit and even went down a little bit of a subprocess rabbit hole some more this evening to see if I could solve it.

I'm invoking this GUI like this:

passengers = flight_manifest.run_flight_manifest(project)

The code for the GUI itself is very nearly the same as above, here's the tiny change I made:

# From Jonny Saunders, the legend
# See here: https://github.com/auto-pi-lot/autopilot/discussions/191

from PySide2 import QtWidgets
from PySide2.QtWidgets import QCheckBox, QPushButton, QLabel, QGroupBox
from typing import List, Dict, Tuple, Optional
import sys
from pathlib import Path

SERVER_PATHS = {"specialk_cs": Path("V:"),
                "specialk_lh": Path("U:")}

class CheckList(QtWidgets.QWidget):

    def __init__(self, project: str, title:str="Subjects", **kwargs):
        super(CheckList, self).__init__(**kwargs)
        self._flight_manifest = self.get_subjects(project)
        self._checkboxes = {} # type: Dict[str, QCheckBox]
        self.title = title

        self.layout = QtWidgets.QVBoxLayout()

        # Add checkboxes to layout
        self.layout.addWidget(self._init_checkboxes())
        # Add button to layout
        self.ok_button = QPushButton("OK")
        self.layout.addWidget(self.ok_button)

        # connect button to action triggered when clicked
        self.ok_button.clicked.connect(self.print_values)

        # set layout of main widget
        self.setLayout(self.layout)

    def value(self) -> Dict[str, bool]:
        return {
            sub: box.isChecked() for sub, box in self._checkboxes.items() 
        }

    @classmethod
    def get_subjects(cls, project) -> list:
        """
        Query server location for subjects.
        """

        print("Getting subjects for flight manifest...")

        subject_directory = SERVER_PATHS[project] / "subjects"

        flight_manifest = [subject.name for subject in subject_directory.glob("*")]

        return flight_manifest

    def _init_checkboxes(self) -> QGroupBox:
        # Button groupbox
        check_group = QGroupBox(self.title)
        # button layout
        check_layout = QtWidgets.QVBoxLayout()
        
        # make checkboxes
        for subject in self._flight_manifest:
            box = QCheckBox(subject)
            # add checkbox to layout so it's displayed
            check_layout.addWidget(box)
            # save reference to checkboxes to get value later
            self._checkboxes[subject] = box

        # set layout full of buttons for groupbox
        check_group.setLayout(check_layout)
        return check_group


    def print_values(self):
        print(self.value())


def run_flight_manifest(project):
    
    app = QtWidgets.QApplication(sys.argv)
    subjects = CheckList(project=project)
    subjects.show()
    app.exec_()

I'm being a bad noodle by having the logic of getting subjects in the same object, but since understanding how to use the basics of class methods has me pretty excited I went ahead and did it anyways.

Any advice on how to properly capture what happens when you press the button? I also tried to simply print to stdout for the subprocess bit but didn't quite get there...

[jmdelahanty]

First, to answer this last part, here's how I'm currently doing it:

def run(project):
    
    app = QtWidgets.QApplication(sys.argv)
    subjects = CheckList(project=project)
    subjects.show()
    app.exec_()
    passengers = subjects.get_values()
    return passengers

The contents of the app are retained even after its closed Jonny taught me! So that's how you capture it. Literally just set that function that returns values to a variable and pass it along to the next step.

[jmdelahanty]

I discovered that we have many subjects to image. It's so long that the checkboxes no longer fit on the screen! So I've been looking into how to add a scrollbar to things. Here's how I've gotten at least a basic scrollbar going:

# From Jonny Saunders, the legend
# See here: https://github.com/auto-pi-lot/autopilot/discussions/191

from PySide2 import QtWidgets
from PySide2.QtWidgets import QCheckBox, QPushButton, QLabel, QGroupBox, QWidget, QScrollArea, QMainWindow
from PySide2 import QtCore
from typing import List, Dict, Tuple, Optional
import sys
from pathlib import Path

SERVER_PATHS = {"specialk_cs": Path("V:"),
                "specialk_lh": Path("U:")}

class CheckList(QMainWindow):

    def __init__(self, project: str, title:str="Subjects", **kwargs):
        super(CheckList, self).__init__(**kwargs)
        self.scroll = QScrollArea()
        self._flight_manifest = self.get_subjects(project)
        self._checkboxes = {} # type: Dict[str, QCheckBox]
        self.title = title
        self._selected_subjects = self.get_values()

        self.layout = QtWidgets.QVBoxLayout()

        # Add checkboxes to layout
        self.scroll.setWidget(self._init_checkboxes())
        # Add button to layout
        self.ok_button = QPushButton("OK")
        self.layout.addWidget(self.ok_button)

        # connect button to action triggered when clicked
        self.ok_button.clicked.connect(self.get_values)

        # Make scroll main widget
        self.setCentralWidget(self.scroll)
    
        # set layout of main widget
        self.setLayout(self.layout)

    def value(self) -> Dict[str, bool]:
        return {
            sub: box.isChecked() for sub, box in self._checkboxes.items() 
        }

    @classmethod
    def get_subjects(cls, project) -> list:
        """
        Query server location for subjects.
        """

        print("Getting subjects for flight manifest...")

        subject_directory = SERVER_PATHS[project] / "subjects"

        flight_manifest = [subject.name for subject in subject_directory.glob("*")]

        return flight_manifest

    def _init_checkboxes(self) -> QGroupBox:
        # Button groupbox
        check_group = QGroupBox(self.title)
        # button layout
        check_layout = QtWidgets.QVBoxLayout()

        # make checkboxes
        for subject in self._flight_manifest:
            box = QCheckBox(subject)
            # add checkbox to layout so it's displayed
            check_layout.addWidget(box)
            # save reference to checkboxes to get value later
            self._checkboxes[subject] = box

        # set layout full of buttons for groupbox
        check_group.setLayout(check_layout)
        return check_group


    def get_values(self):
        # get subjects from value method
        selected_subjects = self.value()

        # grab only subjects that were selected
        selected_subjects = [subject for subject in selected_subjects if selected_subjects[subject]]
        
        self.close()

        return selected_subjects

The main changes I made were to change the Checklist object's inheritance to a QMainWindow after trying for a bit to follow this tutorial. From there I just added a QScrollArea, set the _init_checkboxes to the scrolling widget, and then finally set the scrollbar as the mainwidget.

This works for some reason. When you close the window, it saves the selected subjects. I'm not really sure why. The main problem now is I can't seem to retain the OK pushbutton in the layout. I think I might have to dock it or something as a dockWidget? The adventure continues.

EDIT:

Moving around the button and assigning it to the scrollbar widget populated by _init_checkboxes appears to have done it? I feel like this is a hacky way...

# From Jonny Saunders, the legend
# See here: https://github.com/auto-pi-lot/autopilot/discussions/191

from PySide2 import QtWidgets
from PySide2.QtWidgets import QCheckBox, QPushButton, QLabel, QGroupBox, QWidget, QScrollArea, QMainWindow
from PySide2 import QtCore
from typing import List, Dict, Tuple, Optional
import sys
from pathlib import Path

SERVER_PATHS = {"specialk_cs": Path("V:"),
                "specialk_lh": Path("U:")}

class CheckList(QMainWindow):

    def __init__(self, project: str, title:str="Subjects", **kwargs):
        super(CheckList, self).__init__(**kwargs)
        self.scroll = QScrollArea()
        self._flight_manifest = self.get_subjects(project)
        self._checkboxes = {} # type: Dict[str, QCheckBox]
        self.title = title
        self._selected_subjects = self.get_values()
        self.setWindowTitle("Select Subjects")

        self.layout = QtWidgets.QVBoxLayout()

        # Add checkboxes to layout
        self.scroll.setWidget(self._init_checkboxes())

        # Make scroll main widget
        self.setCentralWidget(self.scroll)
    
        # set layout of main widget
        self.setLayout(self.layout)

    def value(self) -> Dict[str, bool]:
        return {
            sub: box.isChecked() for sub, box in self._checkboxes.items() 
        }

    @classmethod
    def get_subjects(cls, project) -> list:
        """
        Query server location for subjects.
        """

        print("Getting subjects for flight manifest...")

        subject_directory = SERVER_PATHS[project] / "subjects"

        flight_manifest = [subject.name for subject in subject_directory.glob("*")]

        return flight_manifest

    def _init_checkboxes(self) -> QGroupBox:
        # Button groupbox
        check_group = QGroupBox(self.title)
        # button layout
        check_layout = QtWidgets.QVBoxLayout()
        
        button = QPushButton("OK")
        button.clicked.connect(self.get_values)
        check_layout.addWidget(button)

        # make checkboxes
        for subject in self._flight_manifest:
            box = QCheckBox(subject)
            # add checkbox to layout so it's displayed
            check_layout.addWidget(box)
            # save reference to checkboxes to get value later
            self._checkboxes[subject] = box

        # set layout full of buttons for groupbox
        check_group.setLayout(check_layout)
        return check_group


    def get_values(self):
        # get subjects from value method
        selected_subjects = self.value()

        # grab only subjects that were selected
        selected_subjects = [subject for subject in selected_subjects if selected_subjects[subject]]
        
        self.close()

        return selected_subjects

        


def run(project):
    
    app = QtWidgets.QApplication(sys.argv)
    subjects = CheckList(project=project)
    subjects.show()
    app.exec_()
    passengers = subjects.get_values()
    return passengers