Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Nested box layouts giving unexpected results
Qt 6.11 is out! See what's new in the release blog

Nested box layouts giving unexpected results

Scheduled Pinned Locked Moved Solved General and Desktop
16 Posts 3 Posters 1.7k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • dheerendraD Offline
    dheerendraD Offline
    dheerendra
    Moderators Qt Champions 2024 Qt Champions 2022 Qt Champions 2017
    wrote on last edited by dheerendra
    #7

    Let us do one-by-one. Otherwise it is very difficult to fix your issue.

    1. Let us take only windowlayout class.
    2. Constructor- Remove all the code.
    3. Just create only buttons.
    4. Add all these buttons to horizontal layout(pBottomLayout).
    5. this.setLayout(pBottomLayout).
    6. Create the object of WindowLayout in main.cpp
    7. Display it.
    8. If you see all the buttons in the horizontal manner, then your first step is complete.

    If are able to do this, then we can get into next step.

    Also consider @SGaist suggestion on using the Wizard as well.

    Dheerendra
    @Community Service
    Certified Qt Specialist
    https://www.pthinks.com

    A 1 Reply Last reply
    0
    • dheerendraD dheerendra

      Let us do one-by-one. Otherwise it is very difficult to fix your issue.

      1. Let us take only windowlayout class.
      2. Constructor- Remove all the code.
      3. Just create only buttons.
      4. Add all these buttons to horizontal layout(pBottomLayout).
      5. this.setLayout(pBottomLayout).
      6. Create the object of WindowLayout in main.cpp
      7. Display it.
      8. If you see all the buttons in the horizontal manner, then your first step is complete.

      If are able to do this, then we can get into next step.

      Also consider @SGaist suggestion on using the Wizard as well.

      A Offline
      A Offline
      AaronKelsey
      wrote on last edited by AaronKelsey
      #8

      @dheerendra
      I have reduced my code and I have been able to add 4 QPushButtons to a QHBoxLayout and display them horizontally. I have then added the layout to a QFrame widget and it display on the screen at 0,0 of the window. I have then added the frame widget to a QVBoxLayout but it just will not be added to it. when I use pMainLayout->addWidget(pBottomFrame) I expected it to be put inside the vetical layout but nothing happens.

      #include "windowlayout.h"
      
      WindowLayout::WindowLayout(QWidget *pParent) :
                    QWidget(pParent)
      {
        pBottomLayout = new QHBoxLayout();
        pMainLayout = new QVBoxLayout();
      
        QFrame* pBottomFrame = new QFrame(this);
        pBottomFrame->setFrameStyle(QFrame::Panel | QFrame::Raised);
        pBottomFrame->setLineWidth(2);
      
        pBackButton = new QPushButton(tr("Back"), this);
        pNextButton = new QPushButton(tr("Next"), this);
        pCancelButton = new QPushButton(tr("Cancel"), this);
        pCertificateButton = new QPushButton(tr("View Certificates"), this);
      
        // Add widgets to bottom layout
        pBottomLayout->addWidget(pCertificateButton);
        pBottomLayout->addWidget(pBackButton);
        pBottomLayout->addWidget(pNextButton);
        pBottomLayout->addWidget(pCancelButton);
      
        pBottomFrame->setLayout(pBottomLayout);
        //pBottomFrame->move(50,50);
      
        pMainLayout->addWidget(pBottomFrame);
      
        //QLabel* pLabel = new QLabel("Label");
        //pMainLayout->addWidget(pLabel);
      }
      
      
      1 Reply Last reply
      0
      • dheerendraD Offline
        dheerendraD Offline
        dheerendra
        Moderators Qt Champions 2024 Qt Champions 2022 Qt Champions 2017
        wrote on last edited by
        #9

        Hang on. Don't do too many things. Just add buttons, horizontal layout and set layout. Then show it. Does it show the 4 buttons. Confirm this first .

        Dheerendra
        @Community Service
        Certified Qt Specialist
        https://www.pthinks.com

        1 Reply Last reply
        0
        • dheerendraD Offline
          dheerendraD Offline
          dheerendra
          Moderators Qt Champions 2024 Qt Champions 2022 Qt Champions 2017
          wrote on last edited by
          #10

          Just do this in constructor. Show only WindowLayout object. See how does it go.

            pBottomLayout = new QHBoxLayout();
            pBackButton = new QPushButton(tr("Back"), this);
            pNextButton = new QPushButton(tr("Next"), this);
            pCancelButton = new QPushButton(tr("Cancel"), this);
            pCertificateButton = new QPushButton(tr("View Certificates"), this);
          
            // Add widgets to bottom layout
            pBottomLayout->addWidget(pCertificateButton);
            pBottomLayout->addWidget(pBackButton);
            pBottomLayout->addWidget(pNextButton);
            pBottomLayout->addWidget(pCancelButton);
            this->setLayout(pBottomLayout);
          

          Dheerendra
          @Community Service
          Certified Qt Specialist
          https://www.pthinks.com

          A 1 Reply Last reply
          0
          • dheerendraD dheerendra

            Just do this in constructor. Show only WindowLayout object. See how does it go.

              pBottomLayout = new QHBoxLayout();
              pBackButton = new QPushButton(tr("Back"), this);
              pNextButton = new QPushButton(tr("Next"), this);
              pCancelButton = new QPushButton(tr("Cancel"), this);
              pCertificateButton = new QPushButton(tr("View Certificates"), this);
            
              // Add widgets to bottom layout
              pBottomLayout->addWidget(pCertificateButton);
              pBottomLayout->addWidget(pBackButton);
              pBottomLayout->addWidget(pNextButton);
              pBottomLayout->addWidget(pCancelButton);
              this->setLayout(pBottomLayout);
            
            A Offline
            A Offline
            AaronKelsey
            wrote on last edited by
            #11

            @dheerendra said in Nested box layouts giving unexpected results:

            pBottomLayout = new QHBoxLayout();
            pBackButton = new QPushButton(tr("Back"), this);
            pNextButton = new QPushButton(tr("Next"), this);
            pCancelButton = new QPushButton(tr("Cancel"), this);
            pCertificateButton = new QPushButton(tr("View Certificates"), this);

            // Add widgets to bottom layout
            pBottomLayout->addWidget(pCertificateButton);
            pBottomLayout->addWidget(pBackButton);
            pBottomLayout->addWidget(pNextButton);
            pBottomLayout->addWidget(pCancelButton);
            this->setLayout(pBottomLayout);

            I can confirm that this code works and shows on the screen.

            1 Reply Last reply
            0
            • dheerendraD Offline
              dheerendraD Offline
              dheerendra
              Moderators Qt Champions 2024 Qt Champions 2022 Qt Champions 2017
              wrote on last edited by
              #12

              Now let us add the title in the constructor.

              QLabel *title  = new QLabel("AaronKelsey");
              QVBoxLayout *topLyt = new QVBoxLayout;
              topLyt->addWidget(title);
              topLyt->addLayout(pBottomLayout);
              this->setLayout(topLyt).
              /* this->setLayout(pBottomLayout)*/
              

              Now your final layout is topLyt. So remove So
              this->setLayout(pBottomLayout) & do like the above.

              Dheerendra
              @Community Service
              Certified Qt Specialist
              https://www.pthinks.com

              A 1 Reply Last reply
              0
              • dheerendraD dheerendra

                Now let us add the title in the constructor.

                QLabel *title  = new QLabel("AaronKelsey");
                QVBoxLayout *topLyt = new QVBoxLayout;
                topLyt->addWidget(title);
                topLyt->addLayout(pBottomLayout);
                this->setLayout(topLyt).
                /* this->setLayout(pBottomLayout)*/
                

                Now your final layout is topLyt. So remove So
                this->setLayout(pBottomLayout) & do like the above.

                A Offline
                A Offline
                AaronKelsey
                wrote on last edited by AaronKelsey
                #13

                @dheerendra I have implemented this code and the title displays correctly, will it be difficult to set page 1/2/3 etc as the middle layout in the vertical box layout?

                1 Reply Last reply
                0
                • dheerendraD Offline
                  dheerendraD Offline
                  dheerendra
                  Moderators Qt Champions 2024 Qt Champions 2022 Qt Champions 2017
                  wrote on last edited by
                  #14

                  Nothing is difficult. We have to apply the concept one by one. Now do the following

                  QLabel *title  = new QLabel("AaronKelsey");
                  QLabel  *centerContent = new QLabel("MidContent");
                  QVBoxLayout *topLyt = new QVBoxLayout;
                  topLyt->addWidget(title);
                  topLyt->addWidget(centerContent);
                  topLyt->addLayout(pBottomLayout);
                  this->setLayout(topLyt).
                  

                  Now tell me what happens. With this you should be able to understand how things work.

                  Dheerendra
                  @Community Service
                  Certified Qt Specialist
                  https://www.pthinks.com

                  A 1 Reply Last reply
                  0
                  • dheerendraD dheerendra

                    Nothing is difficult. We have to apply the concept one by one. Now do the following

                    QLabel *title  = new QLabel("AaronKelsey");
                    QLabel  *centerContent = new QLabel("MidContent");
                    QVBoxLayout *topLyt = new QVBoxLayout;
                    topLyt->addWidget(title);
                    topLyt->addWidget(centerContent);
                    topLyt->addLayout(pBottomLayout);
                    this->setLayout(topLyt).
                    

                    Now tell me what happens. With this you should be able to understand how things work.

                    A Offline
                    A Offline
                    AaronKelsey
                    wrote on last edited by
                    #15

                    @dheerendra
                    This is the result so far:

                    0_1544710484176_Capture.PNG

                    I am understanding how this pieces together by adding widgets. I would like each page to use a vertical layer and for that to be added as the center content, how would you go about this?

                    1 Reply Last reply
                    0
                    • dheerendraD Offline
                      dheerendraD Offline
                      dheerendra
                      Moderators Qt Champions 2024 Qt Champions 2022 Qt Champions 2017
                      wrote on last edited by
                      #16

                      This is where your QStackWidget comes. Now create the instance of WindowLayout objects in your CertTool. Do the rest of the stuff as shown below.

                      pPageOne = new WindowLayout
                      pPageTwo = new WindowLayout
                      pPageThree = new WindowLayout
                      
                      pStackedWidget = new QStackedWidget(this);
                      
                      // Add pages to stacked widget
                      pStackedWidget->addWidget(pPageOne);
                      pStackedWidget->addWidget(pPageTwo);
                      pStackedWidget->addWidget(pPageThree);
                      
                      // Set Page One as start page
                      pStackedWidget->setCurrentWidget(pPageOne);
                      
                      setCentralWidget(pStackedWidget);
                      
                      // Window settings
                      window()->setWindowTitle("App");
                      window()->setMinimumSize(600,450);
                      
                      // Connect pages to CertTool to allow changing of stacked widget index
                      connect(pPageOne, SIGNAL(setPage(int)), this, SLOT(setPage(int)));
                      connect(pPageTwo, SIGNAL(setPage(int)), this, SLOT(setPage(int)));
                      connect(pPageThree, SIGNAL(setPage(int)), this, SLOT(setPage(int)));
                      

                      Dheerendra
                      @Community Service
                      Certified Qt Specialist
                      https://www.pthinks.com

                      1 Reply Last reply
                      0

                      • Login

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Categories
                      • Recent
                      • Tags
                      • Popular
                      • Users
                      • Groups
                      • Search
                      • Get Qt Extensions
                      • Unsolved