diff --git a/.github/workflows/generation.yml b/.github/workflows/generation.yml index 4719833..5ce4a1f 100644 --- a/.github/workflows/generation.yml +++ b/.github/workflows/generation.yml @@ -23,5 +23,5 @@ jobs: run: pdm install - name: Run pyside6-uic and pyside6-rcc run: | - pdm run pyside6-uic ui/main_window.ui -o hockeygameclock/frontend/ui/main_window.py --from-imports - pdm run pyside6-rcc ui/resources.qrc -o hockeygameclock/frontend/ui/resources_rc.py + pdm run pyside6-uic ui/clock_widget.ui -o hockeygameclock/frontend/generated/clock_widget.py --from-imports + # pdm run pyside6-rcc ui/resources.qrc -o hockeygameclock/frontend/ui/resources_rc.py diff --git a/.gitignore b/.gitignore index 9b5ea3c..a01aa81 100644 --- a/.gitignore +++ b/.gitignore @@ -17,5 +17,5 @@ __pycache__/ /docs/_build/ # Generated Qt user interface Python files -/hockeygameclock/frontend/ui/*.py -!/hockeygameclock/frontend/ui/__init__.py +/hockeygameclock/frontend/generated/*.py +!/hockeygameclock/frontend/generated/__init__.py diff --git a/.vscode/settings.json b/.vscode/settings.json index 61c7a01..c7096c7 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -6,7 +6,7 @@ "editor.codeActionsOnSave": { "source.organizeImports": true, }, - "python.formatting.provider": "black", + "python.formatting.provider": "none", "python.linting.enabled": true, "python.linting.pylintEnabled": true, "python.linting.mypyEnabled": true, @@ -15,4 +15,7 @@ "hockeygameclock" ], "esbonio.sphinx.confDir": "", + "[python]": { + "editor.defaultFormatter": "ms-python.black-formatter" + }, } \ No newline at end of file diff --git a/docs/developer/development.rst b/docs/developer/development.rst index bd2adf1..d9f51b5 100644 --- a/docs/developer/development.rst +++ b/docs/developer/development.rst @@ -10,29 +10,26 @@ The ``hockeygameclock`` relies on `Qt `_ as frontend and the binding. The GUI is developed and designed with help of the `Qt Designer `_. You -can open the Qt Designer with the following commands: +can open the Qt Designer with the following command: -.. code-block:: batch +.. code-block:: shell - :: Activate virtual environment - .venv\Scripts\activate.bat + # Open the Qt Designer + pdm run pyside6-designer - :: Open Qt Designer - pyside6-designer + # Open the Qt Designer for a specific .ui file + pdm run pyside6-designer ui/clock_widget.ui The Qt Designer works with ``.ui`` files to describe the developed GUI. However, to uses these information in combination with Python, we have to convert them to Python code. This can be done with the following commands: -.. code-block:: batch +.. code-block:: shell - :: Activate virtual environment - .venv\Scripts\activate.bat + # Convert user interface files to Python + pdm run pyside6-uic ui/clock_widget.ui -o hockeygameclock/frontend/generated/clock_widget.py --from-imports - :: Convert user interface files to Python - pyside6-uic ui/main_window.ui -o hockeygameclock/frontend/ui/main_window.py --from-imports - - :: Convert resource file to Python - pyside6-rcc ui/resources.qrc -o hockeygameclock/frontend/ui/resources_rc.py + # Convert resource file to Python + # pdm run pyside6-rcc ui/resources.qrc -o hockeygameclock/frontend/ui/resources_rc.py Backend ------- diff --git a/hockeygameclock/frontend/clock_page.py b/hockeygameclock/frontend/clock_page.py index 40b9b54..62ff131 100644 --- a/hockeygameclock/frontend/clock_page.py +++ b/hockeygameclock/frontend/clock_page.py @@ -5,8 +5,10 @@ from typing import Optional -from PySide6.QtCore import Qt -from PySide6.QtWidgets import QGridLayout, QLabel, QWidget +from PySide6.QtWidgets import QWidget + +# pylint: disable-next=import-error,no-name-in-module +from hockeygameclock.frontend.generated.clock_widget import Ui_ClockWidget # type: ignore[reportMissingImports] class ClockPage(QWidget): @@ -14,9 +16,4 @@ class ClockPage(QWidget): def __init__(self, parent: Optional[QWidget] = None) -> None: super().__init__(parent) - self._layout = QGridLayout(self) - label = QLabel(self) - label.setText("Clock") - label.setStyleSheet('color: rgb(255, 255, 255); font: 700 48pt "Segoe UI";') - label.setAlignment(Qt.AlignmentFlag.AlignCenter) - self._layout.addWidget(label) + Ui_ClockWidget().setupUi(self) diff --git a/hockeygameclock/frontend/generated/__init__.py b/hockeygameclock/frontend/generated/__init__.py new file mode 100644 index 0000000..d6460e9 --- /dev/null +++ b/hockeygameclock/frontend/generated/__init__.py @@ -0,0 +1,2 @@ +"""generated module. +""" diff --git a/hockeygameclock/py.typed b/hockeygameclock/py.typed new file mode 100644 index 0000000..e69de29 diff --git a/pyproject.toml b/pyproject.toml index d30f880..04936af 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -61,6 +61,7 @@ line-length = 120 [tool.pylint.main] load-plugins = ["pylint.extensions.docparams"] ignored-modules = ["PySide6"] +ignore-paths = ["hockeygameclock/frontend/generated"] extension-pkg-whitelist = ["PySide6"] [tool.pylint.format] @@ -83,7 +84,7 @@ default-docstring-type = "google" warn_return_any = true [[tool.mypy.overrides]] -module = "hockeygameclock.frontend.ui.*" +module = "hockeygameclock.frontend.generated.*" ignore_missing_imports = true diff --git a/ui/clock_widget.ui b/ui/clock_widget.ui new file mode 100644 index 0000000..9104d28 --- /dev/null +++ b/ui/clock_widget.ui @@ -0,0 +1,1286 @@ + + + ClockWidget + + + + 0 + 0 + 965 + 763 + + + + Form + + + #clock_page { + background-color: rgb(40, 45, 50); +} +QFrame { + border: none; + border-radius: 2px; + background-color: rgb(25, 30, 35); +} +QTimeEdit, QLineEdit, QSpinBox, QSpinBox, QPushButton, QTableView { + border: none; + border-radius: 10px; + color: rgb(225, 225, 225); + background-color: rgb(25, 30, 35); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(50, 60, 70); +} + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + 0 + + + + + + 0 + 0 + + + + + 16 + true + + + + + + + Home + + + 25 + + + true + + + Qt::AlignCenter + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 16 + true + + + + + + + Guest + + + 25 + + + Qt::AlignCenter + + + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + 0 + 5 + + + + + 16777215 + 5 + + + + QFrame::StyledPanel + + + QFrame::Raised + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + 0 + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + 0 + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + Segoe UI + 36 + true + + + + + + + false + + + Qt::AlignCenter + + + true + + + QAbstractSpinBox::NoButtons + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + 0 + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(50, 150, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(50, 200, 50); +} + + + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(150, 50, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(200, 50, 50); +} + + + - + + + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 12 + true + + + + + + + Timeout + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 40 + 40 + + + + + 16 + true + + + + + + + Qt::AlignCenter + + + true + + + QAbstractSpinBox::NoButtons + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 36 + true + + + + + + + Qt::AlignCenter + + + true + + + QAbstractSpinBox::NoButtons + + + + + + mm:ss + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 12 + true + + + + #clock_start_stop { + color: rgb(225, 225, 225); + background-color: rgb(50, 150, 50); +} +#clock_start_stop:hover { + color: rgb(255, 255, 255); + background-color: rgb(50, 200, 50); +} + + + Start + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + Segoe UI + 36 + true + + + + + + + false + + + Qt::AlignCenter + + + true + + + QAbstractSpinBox::NoButtons + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + 0 + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(50, 150, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(50, 200, 50); +} + + + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(150, 50, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(200, 50, 50); +} + + + - + + + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + 0 + 0 + + + + + 0 + 0 + + + + + 12 + true + + + + + + + Timeout + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + 0 + 5 + + + + + 16777215 + 5 + + + + + + + QFrame::StyledPanel + + + QFrame::Raised + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + 0 + + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(50, 150, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(50, 200, 50); +} + + + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(150, 50, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(200, 50, 50); +} + + + - + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 12 + true + + + + + + + Edit + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + 0 + + + 0 + + + 0 + + + 0 + + + 0 + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(50, 150, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(50, 200, 50); +} + + + + + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 12 + true + + + + QPushButton { + color: rgb(225, 225, 225); + background-color: rgb(150, 50, 50); +} +QPushButton:hover { + color: rgb(255, 255, 255); + background-color: rgb(200, 50, 50); +} + + + - + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + 0 + 0 + + + + + 12 + true + + + + + + + Edit + + + + + + + Qt::Horizontal + + + + 40 + 20 + + + + + + + + + + Qt::Vertical + + + + 20 + 40 + + + + + + + + + + + + + + + + + + + +