Python: Updating old GUI app to work with the current Custom Widgets module update | PySide/PyQt

Responsive pyside pyqt GUI.png

INTRO

Join me for a special livestream.

In this livestream I am going to show you how you can easily convert your old PySide or PyQt desktop apps to work with the custom widgets module without any errors

We are going to update this old GUI tutorial from this video.

Steps

Follow the steps listed below if you have been using Custom Widgets Module version 0.6.8 or earlier versions. Custom widgets folders

These are the steps were going to follow:

  • Install the latest Custom Widgets module
      pip install --upgrade QT-PyQt-PySide-Custom-Widgets
  • Our GUI also uses an old version of PySideExtn that does not support PySide6 so we will install the new updated version I made(Skip this part if you dont need PySideExtn)
      pip install PySideExtn
  • After installation, create an empty folder.
  • Inside this folder, create a new Custom Widgets project by running the command below
      Custom_Widgets --create-project
  • Follow the onscreen prompt and feel the data you want.
  • After the project has been created you can run it to ensure everything is working
  • Now open your old project folder and copy every file to their respective folder inside the new project folder we just created. Ignore the following files:
    • The png icons files previously generated by the custom widget module, if available.
    • The interface ui_.... .py file genated from qt-designer or uic
    • Qrc rc_..... .py files generated from .qrc files.

    • main.css, _style.scss, and _variables.scss file inside the QSS folder(if available). These files will be generated by the custom widgets module.

      The custom widgets will generate new icons inside the Qss folder. New ui and other files will also be generated.

  • When copying your files, please follow the folder structure described here:

    • Do not put anything inside the generated-files folder. This should only contain files created at run time.
    • Put all your JSon stylesheets for the custom widgets inside the json-styles folder.
    • logs folder is for log files.
    • The Qss folder is for Qt Stylesheet files. By default, this folder will contain icons and scss subfolders.
      • The scss(Sassy CSS) folder contains various scss files. Put your default css/scss code inside the defaultStyle.scss file.
      • The icons folder contains png icons and _icons.qrc files generated by the custom widgets module.
      • Remember to include the _icons.qrc file in your UI files if your want to use the icons.
  • Feel free to add other files and folders as you wish.
  • Now generate new files from your ui files. Assuming that you put all your UI files inside the ‘ui’ folder, run the following command to convert the files:
      Custom_Widgets --convert-ui ui-path --qt-library your-lib

    If youre tired of converting the UI files each time you make some changes, you can run a live files listener that will automatically convert the ui files for you.

      Custom_Widgets --monitor-ui ui-path --qt-library your-lib

    Replace ‘ui-path’ with you ui path or folder, fo this case the ui folder is ‘ui’. Repace ‘your-lib’ with your qt lib, or remove argument(–qt-library your-lib) if youre using PySide6

  • Remember to update the promoted classes inside the UI files. Also, do not forget to update your import statements inside your python files.

  • RUN your project.

    Be patient, new missing icon files will be generated. View your terminal for app theme progress activities.

That’s all. HAPPY CODING

You found this helpful? Support this project

License

MIT

Free Software, Hell Yeah!