Qt Designer Active Button

Adka · wrote on 7 Mar 2025, 18:17

Hallo,

I am writting my firt App with QTDesigner and I have a Problem. I have to Buttons. I would like to change a class to active and no active. It is like so at the start von application:
)

And than when I clicked on Nicht alkoholische Getränke is like this
!

But I would like to look Alkoholishe getranke like Nicht Alkoholishe getranke at the pirst picture. But it is still active;

My main.py

########################################################################
## QT GUI BY SPINN TV(YOUTUBE)
########################################################################

########################################################################
## IMPORTS
########################################################################
import os
import sys
########################################################################
# IMPORT GUI FILE
from ui.ui_interface import *
########################################################################

########################################################################
# IMPORT Custom widgets
from Custom_Widgets import *
from Custom_Widgets.QAppSettings import QAppSettings
########################################################################

########################################################################
## MAIN WINDOW CLASS
########################################################################
class MainWindow(QMainWindow):
    def __init__(self, parent=None):
        QMainWindow.__init__(self)
        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)

        ########################################################################
        # APPLY JSON STYLESHEET
        ########################################################################
        # self = QMainWindow class
        # self.ui = Ui_MainWindow / user interface class
        #Use this if you only have one json file named "style.json" inside the root directory, "json" directory or "jsonstyles" folder.
        # loadJsonStyle(self, self.ui) 

        # Use this to specify your json file(s) path/name
        loadJsonStyle(self, self.ui, jsonFiles = {
            "json-styles/style.json"
            }) 

        ########################################################################

        #######################################################################
        # SHOW WINDOW
        #######################################################################
        self.show() 

        ########################################################################
        # UPDATE APP SETTINGS LOADED FROM JSON STYLESHEET 
        # ITS IMPORTANT TO RUN THIS AFTER SHOWING THE WINDOW
        # THIS PROCESS WILL RUN ON A SEPARATE THREAD WHEN GENERATING NEW ICONS
        # TO PREVENT THE WINDOW FROM BEING UNRESPONSIVE
        ########################################################################
        # self = QMainWindow class
        QAppSettings.updateAppSettings(self)

########################################################################
## EXECUTE APP
########################################################################
if __name__ == "__main__":
    app = QApplication(sys.argv)
    ########################################################################
    ## 
    ########################################################################
    window = MainWindow()
    window.show()
    sys.exit(app.exec_())
########################################################################
## END===>
########################################################################

My ui_interface.py

# -*- coding: utf-8 -*-

################################################################################
## Form generated from reading UI file 'interfaceOHCYGS.ui'
##
## Created by: Qt User Interface Compiler version 6.8.2
##
## WARNING! All changes made in this file will be lost when recompiling UI file!
################################################################################

from PySide6.QtCore import (QCoreApplication, QDate, QDateTime, QLocale,
    QMetaObject, QObject, QPoint, QRect,
    QSize, QTime, QUrl, Qt)
from PySide6.QtGui import (QBrush, QColor, QConicalGradient, QCursor,
    QFont, QFontDatabase, QGradient, QIcon,
    QImage, QKeySequence, QLinearGradient, QPainter,
    QPalette, QPixmap, QRadialGradient, QTransform)
from PySide6.QtWidgets import (QApplication, QFrame, QHBoxLayout, QLabel,
    QMainWindow, QPushButton, QSizePolicy, QStackedWidget,
    QVBoxLayout, QWidget)

from Custom_Widgets.QCustomSlideMenu import QCustomSlideMenu
import resources_rc

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        if not MainWindow.objectName():
            MainWindow.setObjectName(u"MainWindow")
        MainWindow.resize(800, 471)
        MainWindow.setStyleSheet(u"")
        self.centralwidget = QWidget(MainWindow)
        self.centralwidget.setObjectName(u"centralwidget")
        self.centralwidget.setStyleSheet(u"background-color: rgb(27, 27, 39);")
        self.verticalLayout = QVBoxLayout(self.centralwidget)
        self.verticalLayout.setSpacing(0)
        self.verticalLayout.setObjectName(u"verticalLayout")
        self.verticalLayout.setContentsMargins(0, 0, 0, 0)
        self.header = QWidget(self.centralwidget)
        self.header.setObjectName(u"header")
        self.header.setMinimumSize(QSize(0, 60))
        self.header.setMaximumSize(QSize(16777215, 16777215))
        self.header.setStyleSheet(u"background-color: rgb(39, 38, 60);")
        self.verticalLayout_2 = QVBoxLayout(self.header)
        self.verticalLayout_2.setObjectName(u"verticalLayout_2")
        self.verticalLayout_2.setContentsMargins(0, 0, 0, 0)
        self.frame = QFrame(self.header)
        self.frame.setObjectName(u"frame")
        self.frame.setFrameShape(QFrame.Shape.StyledPanel)
        self.frame.setFrameShadow(QFrame.Shadow.Raised)
        self.horizontalLayout = QHBoxLayout(self.frame)
        self.horizontalLayout.setObjectName(u"horizontalLayout")
        self.menuBtn = QPushButton(self.frame)
        self.menuBtn.setObjectName(u"menuBtn")
        self.menuBtn.setMinimumSize(QSize(24, 24))
        self.menuBtn.setMaximumSize(QSize(24, 24))
        self.menuBtn.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
        self.menuBtn.setAutoFillBackground(False)
        icon = QIcon()
        icon.addFile(u":/icons/icons/align-justify.png", QSize(), QIcon.Mode.Normal, QIcon.State.Off)
        self.menuBtn.setIcon(icon)
        self.menuBtn.setIconSize(QSize(24, 24))
        self.menuBtn.setAutoExclusive(False)
        self.menuBtn.setAutoDefault(False)
        self.menuBtn.setFlat(False)

        self.horizontalLayout.addWidget(self.menuBtn, 0, Qt.AlignmentFlag.AlignLeft)

        self.label = QLabel(self.frame)
        self.label.setObjectName(u"label")
        font = QFont()
        font.setPointSize(18)
        self.label.setFont(font)
        self.label.setStyleSheet(u"color: rgb(255, 225, 225);")

        self.horizontalLayout.addWidget(self.label)


        self.verticalLayout_2.addWidget(self.frame, 0, Qt.AlignmentFlag.AlignLeft)


        self.verticalLayout.addWidget(self.header, 0, Qt.AlignmentFlag.AlignTop)

        self.mainBody = QWidget(self.centralwidget)
        self.mainBody.setObjectName(u"mainBody")
        sizePolicy = QSizePolicy(QSizePolicy.Policy.Preferred, QSizePolicy.Policy.Expanding)
        sizePolicy.setHorizontalStretch(0)
        sizePolicy.setVerticalStretch(0)
        sizePolicy.setHeightForWidth(self.mainBody.sizePolicy().hasHeightForWidth())
        self.mainBody.setSizePolicy(sizePolicy)
        self.mainBody.setStyleSheet(u"background-color: rgb(39, 38, 60);")
        self.horizontalLayout_2 = QHBoxLayout(self.mainBody)
        self.horizontalLayout_2.setSpacing(10)
        self.horizontalLayout_2.setObjectName(u"horizontalLayout_2")
        self.horizontalLayout_2.setContentsMargins(-1, 9, -1, -1)
        self.leftMenu = QCustomSlideMenu(self.mainBody)
        self.leftMenu.setObjectName(u"leftMenu")
        self.leftMenu.setMinimumSize(QSize(280, 0))
        self.verticalLayout_4 = QVBoxLayout(self.leftMenu)
        self.verticalLayout_4.setSpacing(0)
        self.verticalLayout_4.setObjectName(u"verticalLayout_4")
        self.verticalLayout_4.setContentsMargins(0, 0, 0, 0)
        self.widget = QWidget(self.leftMenu)
        self.widget.setObjectName(u"widget")
        self.horizontalLayout_3 = QHBoxLayout(self.widget)
        self.horizontalLayout_3.setObjectName(u"horizontalLayout_3")
        self.horizontalLayout_3.setContentsMargins(9, 9, 9, -1)
        self.frame_2 = QFrame(self.widget)
        self.frame_2.setObjectName(u"frame_2")
        self.frame_2.setStyleSheet(u"QPushButton {\n"
"text-align:left;\n"
"	padding:5px 10px;\n"
"	border-radius: 10px;\n"
"\n"
"\n"
"}\n"
"#alkoholischeGetraenkeBtn {\n"
"border-left: 3px solid #cc5bce;\n"
"font-weight:bold;\n"
"background-color: rgb(27, 27, 39);\n"
"}\n"
"")
        self.frame_2.setFrameShape(QFrame.Shape.StyledPanel)
        self.frame_2.setFrameShadow(QFrame.Shadow.Raised)
        self.verticalLayout_5 = QVBoxLayout(self.frame_2)
        self.verticalLayout_5.setObjectName(u"verticalLayout_5")
        self.alkoholischeGetraenkeBtn = QPushButton(self.frame_2)
        self.alkoholischeGetraenkeBtn.setObjectName(u"alkoholischeGetraenkeBtn")
        self.alkoholischeGetraenkeBtn.setEnabled(True)
        self.alkoholischeGetraenkeBtn.setMinimumSize(QSize(220, 30))
        self.alkoholischeGetraenkeBtn.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
        self.alkoholischeGetraenkeBtn.setStyleSheet(u"color: rgb(255, 255, 255);\n"
"border-color:rgb(255, 255, 255);\n"
"")

        self.verticalLayout_5.addWidget(self.alkoholischeGetraenkeBtn)

        self.nichtAlkoholischeGetraenkeBtn = QPushButton(self.frame_2)
        self.nichtAlkoholischeGetraenkeBtn.setObjectName(u"nichtAlkoholischeGetraenkeBtn")
        self.nichtAlkoholischeGetraenkeBtn.setMinimumSize(QSize(250, 30))
        self.nichtAlkoholischeGetraenkeBtn.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
        self.nichtAlkoholischeGetraenkeBtn.setStyleSheet(u"color: rgb(255, 255, 255);")

        self.verticalLayout_5.addWidget(self.nichtAlkoholischeGetraenkeBtn)


        self.horizontalLayout_3.addWidget(self.frame_2, 0, Qt.AlignmentFlag.AlignLeft|Qt.AlignmentFlag.AlignTop)


        self.verticalLayout_4.addWidget(self.widget)


        self.horizontalLayout_2.addWidget(self.leftMenu)

        self.mainBodyContent = QWidget(self.mainBody)
        self.mainBodyContent.setObjectName(u"mainBodyContent")
        self.mainBodyContent.setStyleSheet(u"background-color: rgb(27, 27, 39);")
        self.verticalLayout_3 = QVBoxLayout(self.mainBodyContent)
        self.verticalLayout_3.setObjectName(u"verticalLayout_3")
        self.stackedWidget = QStackedWidget(self.mainBodyContent)
        self.stackedWidget.setObjectName(u"stackedWidget")
        self.page = QWidget()
        self.page.setObjectName(u"page")
        self.stackedWidget.addWidget(self.page)
        self.page_2 = QWidget()
        self.page_2.setObjectName(u"page_2")
        self.stackedWidget.addWidget(self.page_2)

        self.verticalLayout_3.addWidget(self.stackedWidget)


        self.horizontalLayout_2.addWidget(self.mainBodyContent)


        self.verticalLayout.addWidget(self.mainBody)

        MainWindow.setCentralWidget(self.centralwidget)

        self.retranslateUi(MainWindow)

        self.menuBtn.setDefault(False)


        QMetaObject.connectSlotsByName(MainWindow)
    # setupUi

    def retranslateUi(self, MainWindow):
        MainWindow.setWindowTitle(QCoreApplication.translate("MainWindow", u"MainWindow", None))
        self.menuBtn.setText("")
        self.label.setText(QCoreApplication.translate("MainWindow", u"Getr\u00e4nke", None))
        self.alkoholischeGetraenkeBtn.setText(QCoreApplication.translate("MainWindow", u"Alkoholische Getr\u00e4nke", None))
        self.nichtAlkoholischeGetraenkeBtn.setText(QCoreApplication.translate("MainWindow", u"Nicht Alkoholische Getr\u00e4nke", None))
    # retranslateUi

and my style.json

{
  "ShowLogs": true,
  "QMainWindow": [
    {
      "tittle": "getraenkeBar"
    }
  ],
  "QSettings": [
    {
      "ThemeSettings": [
        {
          "CustomTheme": [
            {
              "Background-color": "#000000",
              "Text-color": "#FFFFFF",
              "Accent-color": "#FFFFFF",
              "Icons-color": "#FFFFFF",
              "Theme-name": "Default-theme",
              "Default-Theme": true
            }
          ]
        }
      ],
      "AppSettings": {
        "OrginizationName": "getraenkeBar",
        "ApplicationName": "getraenkeBar Company",
        "OrginizationDormain": "getraenkeBar.org"
      }
    }
  ],
  "QPushButtonGroup": [
    {
      "Buttons": [
        "alkoholischeGetraenkeBtn",
        "nichtAlkoholischeGetraenkeBtn"
      ],
      "Style": [
        {
          "Active": "background-color:#1b1b27;border-left: 3px solid #cc5bce; font-weight:bold",
          "NotActive": "background-color:: transparent; border:none"
        }
      ]
    }
  ],
 "QCustomSlideMenu": [
	  {
		  "name": "leftMenu",
		  "defaultSize": [
			  {
				  "width": 280,
				  "height": "parent"
			  }
		  ],
		  "expandedSize": [
			  {
				  "width": 280,
				  "height": "parent"
			  }
		  ],

		  "collapsedSize": [
			  {
				  "width": 0,
				  "height": "parent"
			  }
		  ],
		  "toggleButton": [
			  {
				  "buttonName": "menuBtn",

				  "menuTransitionAnimation": [
					  {
						  "animationDuration": 500,
						  "animationEasingCurve": "Linear"
					  }
				  ]
			  }
		  ]
	  }

  ],


  "QtBinding": "PySide6"
}

I have also in QtDesigner in Style Sheet:

#alkoholischeGetraenkeBtn {
border-left: 3px solid #cc5bce;
font-weight:bold;
background-color: rgb(27, 27, 39);
}

Could someone help me?

Txanks!

SGaist · wrote on 7 Mar 2025, 20:18

Hi,

Shouldn't you rather use QRadioButton for this task ?

Adka · wrote on 8 Mar 2025, 09:40

No, the Button open the Page where a Table is with Alkoholische Getränke

SGaist · wrote on 8 Mar 2025, 19:58

Ok, understood.

How do you define whether they should be active ?
You could use a style sheet based on a property for example.

Adka · 9 Mar 2025, 13:01

I think, I make nowhere active. Where should and how do it?

Mizmas · A Adka 9 Mar 2025, 09:47

@Adka Do you mean something like this?

In Qt designer, you can set the button property to checkable, then you can right click the button and create or add it to a QButtonGroup, then select the group, and in the properties you can check the "exclusive" property for only one to be active at a time.