Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Changing the QLabel frameshape



  • Hello
    Still on my early steep learning curve here...

    I have a Qlabel set up on my GUI with a frameShape set to Box to give it a border the same colour as the text. All fine.

    How can I turn this frameshape box to NoFrame in my Python routine?

    I have tried various commands and no luck yet. Anything I try either fails or deletes the whole text.

    This is for highlighting selected text in a menu. Is there an easier/better/correct way? I thought this was the simplest.

    Thanks


  • Qt Champions 2019

    @Stevolution said in Changing the Qlabel frameshape:

    How can I turn this frameshape box to NoFrame in my Python routine?

    Like shown in documentation (https://doc.qt.io/qt-5/qlabel.html):

    label->setFrameStyle(QFrame::Panel | QFrame::Sunken);
    

    Just use QFrame::NoFrame



  • @Stevolution said in Changing the Qlabel frameshape:

    I have a Qlabel set up on my GUI with a frameShape set to Box
    How can I turn this frameshape box to NoFrame in my Python routine?

    Assuming you mean in code:

    label.setFrameShape(QtWidgets.QFrame.NoFrame)
    


  • Hmm... I still have lots to learn

    label.setFrameShape(QtWidgets.QFrame.NoFrame) Throws up that I am not using QtWidgets (QWidget?)

    label->setFrameStyle(QFrame::Panel | QFrame::Sunken); Throws up a Syntax at the ::

    self.AUTOREMOTE.setFrameShape(QFrame::NoFrame). What have I written wrong?



  • self.AUTOREMOTE.setStyleSheet("border: 3px solid black") deletes the entire text and border which I don't understand but hey ho.

    Think I need to come up with a different way of doing this


  • Qt Champions 2019

    @Stevolution said in Changing the Qlabel frameshape:

    Throws up a Syntax at the ::

    Well, you have to convert it to Python code...



  • @Stevolution said in Changing the Qlabel frameshape:

    label.setFrameShape(QtWidgets.QFrame.NoFrame) Throws up that I am not using QtWidgets (QWidget?)

    Then show me the constructor line you have in code for creating the QLabel() in the first place? QLabel is also in the QtWidgets namespace, just as QFrame is....



  • I have lots to learn here. Please bear with me.
    I basically have taken a free piece of code from online that controls servos (via Arduino) and a webcam (Pan and tilt), and I am working my way through making a new GUI for it.
    That GUI works, the code compiles.

    As I work down the code, I am learning what each section achieves/does and annotating it

    Might not be the best way to learn, but it is 'kinda' working for me.

        self.setWindowTitle('Remote camera') # set window title
        
        self.Video = self.ui.Video                                  # The window to display the video feed in
    
        # Set up buttons
        self.QuitButton = self.ui.QuitButton                        
        self.PauseButton = self.ui.PauseButton                      
        self.UpdateButton = self.ui.UpdateButton                    # Updates the camera ID
        self.ConnectButton = self.ui.ConnectButton                  # Connects the comms
        self.SysMode_button = self.ui.SysMode_button
        self.WeaponStatus_button = self.ui.WeaponStatus_button
        self.IFF_button = self.ui.IFF_button
        self.Test_button = self.ui.Test_button
        self.TargetPrf_button = self.ui.TargetPrf_button
        self.Spectral_button = self.ui.Spectral_button
        self.TargetSel_button = self.ui.TargetSel_button
    
        # Bind buttons
        self.QuitButton.clicked.connect(self.quit)                  # Bind quit button to quit method
        self.PauseButton.clicked.connect(self.toggle_recording)     # Bind pause button to pause method
        self.UpdateButton.clicked.connect(self.update_angles)
        self.ConnectButton.clicked.connect(self.connect)
    
        # Set up LCD displays
        self.Pan_LCD = self.ui.Pan_LCD                  
        self.Tilt_LCD = self.ui.Tilt_LCD
        self.Ammo_LCD = self.ui.Ammo_LCD                  
        self.Time_LCD = self.ui.Time_LCD
        
        self.Manual_checkbox = self.ui.Manual_checkbox              # Checkbox for manual control
        self.Manual_checkbox.stateChanged.connect(self.set_manual_mode) # Bind checkbox
    
        self.COMlineEdit = self.ui.COMlineEdit                      # Edit the comms channel box
        self.CameraIDEdit = self.ui.CameraIDEdit                    # Camera ID entry box
    
        # Labels
        self.COMConnectLabel = self.ui.COMConnectLabel              # Comms connection label
        
        self.AUTOREMOTE = self.ui.AUTOREMOTE
        self.MANOVERRIDE = self.ui.MANOVERRIDE
        self.SAFE = self.ui.SAFE
        self.ARMED = self.ui.ARMED
        self.ENGAGED = self.ui.ENGAGED
        self.TEST = self.ui.TEST
        self.INTERROGATE = self.ui.INTERROGATE
        self.AUTO = self.ui.AUTO
        self.SELECTIVE = self.ui.SELECTIVE
        self.INERT = self.ui.INERT
        self.INFRARED = self.ui.INFRARED
        self.ULTRASONIC = self.ui.ULTRASONIC
    


  • @Stevolution
    This is a fragment of code which does not address my

    Then show me the constructor line you have in code for creating the QLabel() in the first place?

    You said my

    label.setFrameShape(QtWidgets.QFrame.NoFrame) Throws up that I am not using QtWidgets (QWidget?)

    so I can't tell you what to put without knowing how you import your Qt stuff, your relevant from .. import ... presumably for PyQt5 or PySide2.


  • Banned

    @Stevolution be forewarned supplying only code snippets is likely to get you incorrect answers since there are too many missing elements -- is best to create a MUC or MRE (Minimal Usable Code / Minimal Reproducible Example) they are basically the same thing only a MUC usually just addresses functionality while a MRE usually incorporates reproducing a bug or unexpected results.



  • @JonB said in Changing the Qlabel frameshape:

    @Stevolution
    This is a fragment of code which does not address my

    Then show me the constructor line you have in code for creating the QLabel() in the first place?

    You said my

    label.setFrameShape(QtWidgets.QFrame.NoFrame) Throws up that I am not using QtWidgets (QWidget?)

    so I can't tell you what to put without knowing how you import your Qt stuff, your relevant from .. import ... presumably for PyQt5 or PySide2.

    Sorry - PyQt5

    Maybe I should post all the code once I have tidied it a little



  • @Stevolution said in Changing the QLabel frameshape:

    Sorry - PyQt5

    So, to resolve your "Throws up that I am not using QtWidgets (QWidget?)", if you do not already have this, in the module where you want the line:

    label.setFrameShape(QtWidgets.QFrame.NoFrame)
    

    you will need at the top of the file:

    from PyQt5 import QtWidgets
    

    (There are slightly different ways you can do what is needed, according to preference, but I don't want to over-complicate for now.)

    Damn it, while I'm here, I'd better give you the choices! It's not too hard to understand.

    Say you will want to access QLabel and QFrame in a module. You have two ways.

    from PyQt5 import QtWidgets
    ...
    label = QtWidgets.QLabel()
    label.setFrameShape(QtWidgets.QFrame.NoFrame)
    

    The above way we import just QtWidgets, and every time we want to address a widget we have to go QtWidgets.QLabel, QtWidgets.QFrame etc.

    from PyQt5.QtWidgets import QLabel, QFrame, ...
    ...
    label = QLabel()
    label.setFrameShape(QFrame.NoFrame)
    

    The above way we import specific widget classes from QtWidgets, and when we want to address a widget we can just go QLabel, QFrame etc., not using the leasing QtWidgets..

    Pros/cons for each approach, a matter of personal style/preference.



  • I get an error with that line

    NameError: name 'QtWidgets' is not defined

    Whats the difference between QtWidgets and QWidget?

    import sys                                                          # This imports the modules	
    import time
    
    from PyQt5.QtWidgets import QApplication, QWidget                   # PyQy5 is the GUI module.   QApplication is part of that module, and QWidget is the Windows interaction class (Keyboard, mouse etc)
    from PyQt5.QtGui import QIcon, QPixmap, QImage                      # QImage is a class of PyQt5 that allows image interaction
    from PyQt5.uic import loadUi
    
    
    import opr                                                          # Face tracking Python routine
    import comm_ard                                                     # Python routine to handle the serial communications to the Arduino
    import random                                                       # Random generator 
    import pickle                                                       # Allows you to send data between Python scripts using a byte data stream
    
    import cv2                                                          # Stands for COMPUTER VISION. Allows the code to take information from a visual source
    


  • @Stevolution said in Changing the QLabel frameshape:

    I get an error with that line
    NameError: name 'QtWidgets' is not defined

    Show me the line you typed, copied & pasted! Since I use from PyQt5 import QtWidgets all the time...

    In the way you now show, it is using my "second approach". You have

    from PyQt5.QtWidgets import QApplication, QWidget
    

    so to add references to, say QLabel & QFrame you can either modify to:

    from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QFrame
    

    or add a brand new line

    from PyQt5.QtWidgets import QLabel, QFrame
    

    Don't forget to read what I wrote earlier about when you use this method,

    label.setFrameShape(QtWidgets.QFrame.NoFrame)
    

    becomes

    label.setFrameShape(QFrame.NoFrame)
    

    Whats the difference between QtWidgets and QWidget?

    PyQt5.QtWidgets is a module (like a namespace if you're familiar with that term). That module contains many classes. QWidget is a class in the module QtWidgets. That module contains other additional widget-y classes, such as QFrame.



  • @JonB said in Changing the QLabel frameshape:

    PyQt5.QtWidgets import QApplication, QWidget, QLabel, QFrame

    PyQt5.QtWidgets import QApplication, QWidget, QLabel, QFrame has fixed the issue.
    I didn't realise I needed to add those to the declared list.

    Thank you very much for your time and patience



  • @Stevolution
    As I wrote earlier, if you go for the from PyQt5.QtWidgets import Q... route, which is fine, you must now add to that list each time you want to access a specific class, like QWidget or QFrame or QPushButton, and then you can address those by their plain class name, QWidget or QFrame, instead of QtWidgets.QWidget, QtWidgets.QFrame etc.

    You may also shortcut having to spell out each class name by going

    from PyQt5.QtWidgets import *
    

    This imports as QWidget, QFrame, QPushButton and everything else (non-underscore) in the QtWidgets module, in one go. However, this is usually regarded as poor Python practice [https://docs.python.org/3/tutorial/modules.html].


  • Banned

    @Stevolution said in Changing the QLabel frameshape:

    Whats the difference between QtWidgets and QWidget?

    Basically QtWidgets is a Namespace within the PyQT5 Namespace where you would find the QWidget Class

    So basically QtWidgets is a container (or library) that holds various Classes one of those Classes being QWidget

    Further you can Instantiate the Class QWidget but you cannot Instantiate QtWidgets as it is not a Class

    Does that clarify the difference??



  • Yes. Many thanks for your excellent assistance



  • Without appearing to be totally thick... it's frustrating that I have sorted out all the comms to the Arduino, camera importing etc...

    but cannot get my head around this formatting to change text properties.

    How would I change the font size of a label? All my efforts have failed.
    I had to import the class QFrame to change the frame, but QFont gives a syntax

    This is clearly wrong...

    self.COMConnectLabel.setFontSize(14);


  • Banned

    MyFont = QFont()
    MyFont.setPointSize(14)
    
    MyLabel = QLabel()
    MyLabel.setFont(MyFont)
    

    Oh and do not feel bad about this -- I found that some of the simplest seeming things are actually some of the most complex within the Qt world -- this being one of them



  • I think I need to walk away for a while. Made great progress today....

    But still can't change that text font size!


  • Banned

    I am not sure what problem you are having but here is a simple MUC that demonstrates using some of the built in QFont features

    from PyQt5.QtGui     import QFont
    from PyQt5.QtWidgets import QApplication, QWidget, QVBoxLayout, QLabel
    
    class MainDsply(QWidget):
        def __init__(self):
            QWidget.__init__(self)
            Top=300; Left=700; Width=300; Hight=100
            self.setGeometry(Left, Top, Width, Hight)
            self.setWindowTitle('Font Fun')
    
          # Documentation on what is available to QFont
          # https://doc.qt.io/qt-5/qfont.html
    
          # Setting up Fonts
            fntBigBold = QFont()
            fntBigBold.setPixelSize(36)
            fntBigBold.setBold(True)
            
            fntBookAnt = QFont()
            fntBookAnt.setPixelSize(24)
            fntBookAnt.setFamily('Book Antiqua')
    
            fntSmall = QFont()
            fntSmall.setPixelSize(8)
    
            fntUndrLin = QFont()
            fntUndrLin.setPixelSize(14)
            fntUndrLin.setUnderline(True)
    
            fntSpcOutI = QFont()
            fntSpcOutI.setPixelSize(14)
            fntSpcOutI.setItalic(True)
            fntSpcOutI.setWordSpacing(5.5)
    
          # Using the Fonts
            self.lblOne = QLabel("Big Bold Font")
            self.lblOne.setFont(fntBigBold)
    
            self.lblTwo = QLabel("Book Antiqua Font")
            self.lblTwo.setFont(fntBookAnt)
    
            self.lblTre = QLabel("Spaced Out Italic Font")
            self.lblTre.setFont(fntSpcOutI)
    
            self.lblFor = QLabel("Undelined Font")
            self.lblFor.setFont(fntUndrLin)
    
            self.lblFiv = QLabel("Small Font")
            self.lblFiv.setFont(fntSmall)
    
            VBox = QVBoxLayout()
            VBox.addStretch(1)
            VBox.addWidget(self.lblOne)
            VBox.addWidget(self.lblTwo)
            VBox.addWidget(self.lblTre)
            VBox.addWidget(self.lblFor)
            VBox.addWidget(self.lblFiv)
            VBox.addStretch(1)
    
            self.setLayout(VBox)
    
    if __name__ == "__main__":
        MainEventHandler = QApplication([])
    
        MainApplication = MainDsply()
        MainApplication.show()
        
        MainEventHandler.exec()
    

    You could even set up the Fonts into their own class with preset features that you want to use in your code such as Header Style, Body Style, Signature Style, etc...



  • @Stevolution Thank you Denni. I will have another look at that in a while.

    Just trying to work out why my routine is throwing up an exception when I transfer 6 bytes of data from my Arduino to my Python process.

    I can print all six bytes correctly in the decoding routine (called Comm_ard.py), but when I use bytes 5 or 6 in the Python code, it throws up an exception error. Hmm



  • OK. Fixed the exception issue.

    NOTHING I try will let me change the font size. Spent so much time on this. You suggestions Denni didin't work.
    It's clearly me, but no idea what I am doing wrong. Declared QFont at the start etc.

    It's maddening how something so stupid takes so long


  • Banned

    Does not work ?? But if you copy and paste and run that program it works just fine no issues at all. So what did you do with it that broke it?



  • @Denni-0

    Yes, but I need to implement it in my code. That is a lot of code just to change a font size! Thank you Denni... I do appreciate it.

    I don't really understand why it's so complicated. Why can you not just say: self.COMConnectLabel.setFontSize(14);

    Anyway, I will sort it out



  • @Stevolution

    That is a lot of code just to change a font size!
    I don't really understand why it's so complicated. Why can you not just say: self.COMConnectLabel.setFontSize(14);

    You only need the lines @Denni-0 gave you earlier:

    MyFont = QFont()
    MyFont.setPointSize(14)
    
    MyLabel = QLabel()
    MyLabel.setFont(MyFont)
    

    That's 3 lines to change the label's font. That's just what calls Qt has provided. If you wanted to be able to go self.COMConnectLabel.setFontSize(14) you could subclass your labels to add setFontSize(size) as an available method.



  • S0..

            MyFont = QFont()
            MyFont.setPointSize(18)
    
            self.COMConnectLabel = QLabel()
            self.COMConnectLabel.setFont(MyFont)
    

    This freezes my routine


  • Banned

    This got delayed due to previous/lingering Troll Actions -sigh-

    So are you using Creator/Designer created UIs instead of creating the GUI using straight Python-Qt code?? I mean otherwise it is very simply and straight forward as I demonstrated with the MUC I provided you.

    If you could provide an MRE (Minimal Reproducible Example) of your using that code and it freezing up then we could look it over and help you figure out what you are doing wrong -- because frankly it does work if used properly (as my MUC shows) so all I can say is you are doing something wrong but your not communicating to us what you are doing wrong so we cannot help you to stop doing it ;-)



  • Ha ... thanks Denni
    Yes, using QT Designer. Got nearly everything working except this and a ProgressBar that keeps throwing up an exception.

    I will see if I can make a smaller bit of code and either get it working, or post it for your advice.
    Thanks


  • Banned

    Ah the wonderful Creator/Designer UIs well @Stevolution welcome to just your first of many headaches that you are going to have by using something that does not play nice with Python-Qt code

    BTW did you know that making your GUI is just as easy (or even easier) than using that Designer -- sure I grant you the Designer is sexier cuz its all drag and drop but when your done your left with a continuing headache.

    I say this from experience but not from personally using the Designer but from helping numerous students learn how to use Python-Qt without those horrible UIs -- I mean yeah if you really need an XML version of your GUI then its worth that headache but most folks that I have talked to do not use them for that purpose (they in-a-nutshell use it cuz its sexier) but if they ever actually learn just how easy it is to make that GUI using straight Python-Qt (as nearly all my students have) they leave that tool in the tool box until they need XML code which may be never.

    I tell you what though if you post that UI code along with a screen shot from either what is shown in the Designer or what you get when you run it -- I can show you how to create that via straight Python-Qt and you can see just how easy it is to work with -- I did it just recently for someone on here that was speaking some other language and while I could not understand their language the visuals were enough for me to give them a non-UI version of what they had probably in about the same amount of time they had taken putting the UI together the big difference was mine did all the things they could not seem to get their Designer UI to do -- I have to say seem because as I said I could not read what their issue was but I am pretty sure I fixed them all or many of them based on the pictures they had been showing



  • Thanks Denni, that is a very kind offer.

    The reason I started with QT Designer, is I started with a project that someone else designed using QT Designer, and I have adapted it to my needs.
    I don't know Python. I have come from Arduino programming and its pretty different.

    I have reverse engineered the code, and made far more progress than I thought I would have in a few days.

    I have some fundamental issue somewhere. I have links to the labels, tick boxes, buttons etc all working fine.

    But, I just cannot get the font size to change or the ProgressBar to work.



  • GOT IT

            font = self.COMConnectLabel.font()                                                         
            font.setPointSize(14)
            self.COMConnectLabel.setFont(font)
    

    This worked. Trial and error.

    Now it I need to fix the progress bar



  • Right, the problem with the progressbar is the co-ords.

    In QT Designer, it shows 480,60 20x191 as the co-ords for the Progressbar

    But i declare:

        self.Temp_bar = QProgressBar(self)
        self.Temp_bar.setGeometry(480, 60, 20 , 191)
        self.Temp_bar.setValue(350)
    

    and the Progress bar is way off the screen (so it was working - just not visible).

    The actual co-ords to get it anywhere near the position in QT Designer are (502, 820, 50 , 191) And they are not exact.
    Also, its going from top to bottom instead of as stated in QT Designer, and it's the wrong colour.

    So... have I made my own progress bar that has nothing to do with the design I made in QT Designer, or and I missing something that links them together? Hmm

    Edit/update.

    OK, its all incorrect. From what I understand, for some reason... all the settings in QT Designer are lost.
    I would need to set up a new style sheet to reproduce the one I made in QT Designer. That seems pointless.

    Is there a simpler way to directly draw a progressbar style 'box' that goes vertically up the screen dependant on a variable (I know there will be... I just don't know it yet).

    I do have to say the mixed/incorrect/random information about implementing these functions in QT Designer is very frustrating.


  • Qt Champions 2019

    @Stevolution said in Changing the QLabel frameshape:

    In QT Designer, it shows 480,60 20x191 as the co-ords for the Progressbar
    But i declare:

    One moment: you have one progress bar in designer, but then you add one in code? Why don't you use the one from designer?



  • @Stevolution
    Just to say: there is absolutely nothing wrong with using Qt Designer to design your UI, and auto-generate the Python code which implements it, as you have been doing. The code it generates is easy to understand (if you choose to look at it, you don't have to), and essentially does what you would have to do yourself if you choose to do it manually instead. Especially if you are a beginner, it can ease you into Qt programming without having to learn everything about the classes from the outset. As you have discovered, you can mix static design-time elements with dynamically-created run-time elements as you please.

    Plenty of other toolsets have a visual designer as well as run-time coding. It is largely a matter of personal preference which you choose to use, and there are pros & cons of each approach. Many, but not all, Qt developers use Designer. This applies whether you use C++ or Python. So feel free to follow your chosen path either way.



  • @jsulm

    Well this is what I am trying to learn. This is my first Python code attempt!

    How do I access the one I designed in QT Designer? Googling shows examples such as the one I posted/used, but as you say... I think I have made another progress bar, rather than manage to access the one I made in QT Designer.

    My QT Designer progress bar is called Temp_bar, so I am not sure why it is not accessing it.
    If I don't state the setGeometry, then I cannot see any ProgressBar



  • @JonB

    Where is the code it generates?



  • @Stevolution
    I don't know what you called your design-time progress bar, but you go:

    self.Temp_bar = QProgressBar(self)
    

    As @jsulm said, here you are simply creating your own dynamic, run-time progress bar. If you already have one from designer you should use that one, no ... = QProgressBar(self) in your own code.

    For the code it generates:

    • I see you have from PyQt5.uic import loadUi. So I'm thinking you have chosen not to generate code, you just load the .ui dynamically at run-time via loadUi(). In that case, no Python code is being generated, so there is no source code to look at.

    • You could change to using pyuic5, which you run whenever you change the Designer .ui file content to generate a Python class code from it. In that case, you would find it creates a file named ui_form.py in your source folder where your form.ui file is.

    Have a read of e.g. https://stackoverflow.com/a/52471945/489865 for the pros & cons of each.

    See https://www.riverbankcomputing.com/static/Docs/PyQt5/designer.html for the various choices.

    So to summarise, you have 3 choices for how to do your UI code:

    1. Do not use Qt Designer, write the code yourself manually to create widgets dynamically at run-time.

    2. Use Designer to generate a .ui file. Use PyQt5.uic.loadUi() to load that file dynamically at run-time. No Python code is auto-generated.

    3. Run PyQt5's pyuic5 executable on the .ui file, generating a ui_....py file with a class/member variables for the elements. import this .py file into yours and access the class methods/variables.



  • OK. Thank you. self.Temp_bar = self.ui.Temp_bar brought the Progressbar up that I designed immediately.

    This is the part I have been struggling with, as I have found the wealth of information regarding these features on the web... difficult to wade through at best.

    Still learning, but you guys have been super helpful. Thank you for your valuable time


Log in to reply