Python Forum
Modern looking GUI
Thread Rating:
  • 3 Vote(s) - 2.33 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Modern looking GUI
#11
(Jan-11-2019, 12:23 AM)Larz60+ Wrote: Qt is a fine GUI 'system' I do use it myself. My only concern is the commercial side of the product. I've been at this a very long time, and have seen, not free, (as nothing was free back in the late 60's and early 70's), but inexpensive products, eventually become upgrade or leave, with upgrade being price prohibitive for a small company. So I do use it, but not for anything that I intend to sell myself.

Python is now officially supported by the Qt company, they call it PySide2 or Qt for Python. It is released under LGPL so I think that would allow free commercial use.


(Jan-10-2019, 09:56 PM)Cuz Wrote: @Alfalfa
I checked out those apps and I think we're slowly getting there :D VLC for Win 10 is looking way better. Especially using CSS looks promising. Would you by any chance know any intelligible materials I could use to learn more on combining CSS with PyQt5?

@All
I feel like I didn't express what I want to achieve clearly enough. You can have GUI that looks like this:

[Image: maxresdefault.jpg]


You can definetly do something similar with PyQt. Here is an example I made for a draggable frameless window:
https://gitlab.com/snippets/1793843


Then with a simple layout and CSS:

#!/usr/bin/python3
import sys
from PyQt5 import QtCore, QtGui, QtWidgets


CSS = \
{
    'QWidget':
    {
        'background-color': '#333333',
    },
    'QLabel#label':
    {
        'color': '#888888',
        'background-color': '#444444',
        'font-weight': 'bold',
    },
    'QLabel#label:active':
    {
        'color': '#1d90cd',
    },
    'QPushButton#button':
    {
        'color': '#888888',
        'background-color': '#444444',
        'font-weight': 'bold',
        'border': 'none',
        'padding': '5px',
    },
    'QPushButton#button:active':
    {
        'color': '#ffffff',
    },
    'QPushButton#button:hover':
    {
        'color': '#1d90cd',
    }
}

def dictToCSS(dictionnary):
    stylesheet = ""
    for item in dictionnary:
        stylesheet += item + "\n{\n"
        for attribute in dictionnary[item]:
            stylesheet += "  " + attribute + ": " + dictionnary[item][attribute] + ";\n"
        stylesheet += "}\n"
    return stylesheet


class Main(QtWidgets.QMainWindow):
    def __init__(self, parent):
        super().__init__()
        self.setWindowFlags(QtCore.Qt.FramelessWindowHint | QtCore.Qt.WindowStaysOnTopHint)
        self.setStyleSheet(dictToCSS(CSS))
        self.resize(200, 150)
        self.ui = QtWidgets.QWidget(self)
        self.setCentralWidget(self.ui)

        self.ui.button = QtWidgets.QPushButton("Close")
        self.ui.button.setObjectName("button")
        self.ui.button.clicked.connect(self.close)
        self.ui.button.setFocusPolicy(QtCore.Qt.NoFocus)

        self.ui.label = QtWidgets.QLabel("Hello World")
        self.ui.label.setObjectName("label")
        self.ui.label.setAlignment(QtCore.Qt.AlignCenter)

        self.ui.layout = QtWidgets.QVBoxLayout()
        self.ui.layout.setContentsMargins(50, 50, 50, 50)
        self.ui.layout.addWidget(self.ui.button)
        self.ui.layout.addWidget(self.ui.label)
        self.ui.setLayout(self.ui.layout)

        self.show()

    def mouseMoveEvent(self, event):
        # Enable mouse dragging
        if event.buttons() == QtCore.Qt.LeftButton:
            self.move(event.globalPos() - self.dragPosition)
            event.accept()

    def mousePressEvent(self, event):
        # Enable mouse dragging
        if event.button() == QtCore.Qt.LeftButton:
            self.dragPosition = event.globalPos() - self.frameGeometry().topLeft()
            event.accept()

    def keyPressEvent(self, event):
        # Escape key close the window
        if event.key() == QtCore.Qt.Key_Escape:
            self.close()
        QtWidgets.QMainWindow.keyPressEvent(self, event)

    def paintEvent(self, event):
        # Draw a one pixel border
        borderColor = QtGui.QColor("black")
        bgColor = QtGui.QColor(self.palette().color(QtGui.QPalette.Background))
        painter = QtGui.QPainter(self)
        painter.setPen(QtCore.Qt.NoPen)
        painter.setBrush(QtGui.QBrush(borderColor))
        painter.drawRect(0, 0, self.width(), self.height())
        painter.setBrush(QtGui.QBrush(bgColor))
        painter.drawRect(1, 1, self.width()-2, self.height()-2)


if __name__== '__main__':
    app = QtWidgets.QApplication([])
    gui = Main(app)
    sys.exit(app.exec_())
You may also use image or border-image to customize buttons and labels:
Quote: image: url('img1.svg');
border-image: url('img2.svg');
Reply


Messages In This Thread
Modern looking GUI - by Cuz - Jan-10-2019, 09:21 AM
RE: Modern looking GUI - by Larz60+ - Jan-10-2019, 12:41 PM
RE: Modern looking GUI - by metulburr - Jan-10-2019, 12:46 PM
RE: Modern looking GUI - by buran - Jan-10-2019, 01:49 PM
RE: Modern looking GUI - by metulburr - Jan-10-2019, 02:15 PM
RE: Modern looking GUI - by Alfalfa - Jan-10-2019, 02:18 PM
RE: Modern looking GUI - by snippsat - Jan-10-2019, 03:06 PM
RE: Modern looking GUI - by Cuz - Jan-10-2019, 09:56 PM
RE: Modern looking GUI - by Weave - Jan-11-2019, 03:20 PM
RE: Modern looking GUI - by Larz60+ - Jan-11-2019, 12:23 AM
RE: Modern looking GUI - by Alfalfa - Jan-11-2019, 01:26 AM
RE: Modern looking GUI - by metulburr - Jan-11-2019, 12:29 AM
RE: Modern looking GUI - by Larz60+ - Jan-11-2019, 03:41 PM
RE: Modern looking GUI - by Standard_user - Jan-11-2019, 03:53 PM
RE: Modern looking GUI - by Cuz - Jan-11-2019, 09:30 PM

Possibly Related Threads…
Thread Author Replies Views Last Post
  Modern version of XPM files deanhystad 3 2,857 Apr-12-2021, 04:52 PM
Last Post: deanhystad

Forum Jump:

User Panel Messages

Announcements
Announcement #1 8/1/2020
Announcement #2 8/2/2020
Announcement #3 8/6/2020