Window with custom background and modify the content area.



  • I need your help. I want to create a window, inherited from QMainWindow or QDialog. This window will have a fully customized background and text. To draw rewrite the event paintEvent, this without problems. The problem, as I can modify the area where it will represent the contents of the window, widgets, not to draw above the text.

    0_1503545497867_esquema.jpg
    In a bad way, I've resized the content within the paintEvent event . This way is bad but half working.

        layout = self.layout()
        if layout is not None:
            rect = layout.geometry()
            rect.setY(tempHeight)
            layout.setGeometry(rect)
    

    The problems have come when I tried to do the same with MDI windows and especially the QTabWidget widget.

    Thanks in advance for the answers. And if you can help me.


  • Lifetime Qt Champion

    Hi,

    Do you mean you would like to have some margin around your "central widget" as to show your fancy background ?



  • Exactly, I need to modify dimensions and position of the center widget and increase the size of the window with the fantasy border and other elements that are drawn in the custom background.

    I made a new drawing that clarifies it.
    0_1503589117337_esquema2.png

    PS: The solution can be in C++ as in Python. The question is, solve it.
    Thank you.


  • Qt Champions 2016

    Hi
    You can use a layout and the layouts Content Margins
    http://doc.qt.io/qt-5/qlayout.html#setContentsMargins

    That way you reserve the space and the inner widget will be automatically fitted.
    alt text



  • Thanks mrjj.
    I know what you tell me and I used to have it before. But now I need all source code:

    QDialog -> inheriting a class and that does that work

    Without using the designer at any time. There are many types of dialogues that I have.
    So everything, you gave me an idea, modify the margins by source code.

    Thank you very much, today, if I take time, I try and I tell you.


  • Qt Champions 2016

    @GranVeoDuendes
    Hi
    You do not need to use Designer at all.
    This you can also do in pure code with a FancyDialog subclass.
    And give that a function like
    addContentWidget that makes sure its inserted into the inner layout in correct way.

    But is each dialog dynamic and u add different content or is each dialog static and you just have many different ?

    I had a design where i need the Dialogs to have a Header & Footer element.
    So I made a subclass Dialog for that, so it would have these element pr default
    and simply gave it a UI file to load as content.
    So you can use Designer for the actual widgets if you want
    and still have a new type of window giving a custom background.



  • Change icons, decoration, and title. I thought about making a widget and I did not like the first tests.

    This is an actual capture of my application.

    0_1503595531434_Screenshot_20170824_022422.png

    The left side, with the icon and titles is part of that fancy background. I have the methods to assign icon and texts that I put in the constructor. If I assign more icons and more texts there are more columns.

    But the idea of modifying, in the assignment properties of the icons and texts, using a method that modifies the margins, is a very good idea and I think it will work. I try to get home.

    Thank you.



  • Perfect. Thank you very much. It works perfect.

    So that other people, if they have the same problem here have the solution. It's very simple and I did not fall for something so simple. In the properties where I assign the texts and icons we call a method that modifies the margins. Only that.

    For example:

    #import PyQt5 or PySide (To the taste of the client)
    
    class Test(QDialog):
        def __init__(self, parent: QDialog = None):
            super().__init__(parent)
            self.__row_Text = None
    
        @property
        def row_Text(self) -> str:
            return self.__row_Text
    
        @row_Text.setter
        def row_Text(self, value: str):
            self.__row_Text = value
            self.updateFancyBackground()
            self.repaint()
    
         def updateFancyBackground(self):
            # I liked the name Fancy Background
            if self.__row_Text is not None:
                margins = self.layout().contentsMargins()
                margins.setTop(24)
                self.layout().setContentsMargins(margins)
    
        def paintEvent(self, event: QPaintEvent):
            # Your code for height = 24
            pass
    

    Many thanks to "SGaist" and "mrjj", for giving me the idea to solve it.



Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.