Syntax for Vector of QPushbuttons added to FlowLayout

[Swati777999]

Hi All,

I am trying to add multiple QPushbuttons to a FlowLayout through the loop, but my syntax seems to be not correct. Can you provide the correct syntax for the same?

 FlowLayout *flowLayout = new FlowLayout;
 int n=10;
 QVector <QPushButton> Buttons(n);

    for (int ii=0;ii<n;ii++)
    {
        flowLayout->addWidget(Buttons);
        //  flowLayout->addWidget(Buttons[ii]);
    }

In the above code ,
flowLayout->addWidget(Buttons); // flowLayout->addWidget(Buttons[ii]);

Both these lines give errors.Please someone help me with this?

Edit : Thanks to some of the Qt experts in this forum - @JKSH , @Pl45m4 , @Christian-Ehrlicher , @jsulm , @ChrisW67 , who helped me to reach the solution. You guys were super supportive to me and actively helped me. Thanks a ton!

[Swati777999]

@JKSH said in Syntax for Vector of QPushbuttons added to FlowLayout:

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

In this case , the setminimumsize() for the widget is not used ,that's why the buttons take a vertical layout.

That's an incomplete answer.

1. You also get a "vertical layout" if you call flowWidget->setMinimumSize(100, 100). Why?
2. What is the minimum size that you need to get 2 buttons per row?

Now, I'm trying out the second part of this design

No, don't do this yet.

Here's the simplified code for the entire design . I created a new project scrollAreaApp with the base class as QMainWindow
scrollAreaApp.cpp

#include "scrollareaapp.h"

ScrollAreaApp::ScrollAreaApp(QWidget *parent)
    : QMainWindow(parent)
{
    QWidget *flowWidget = new QWidget();
    FlowLayout *flowLayout = new FlowLayout();
    flowWidget->setLayout(flowLayout);
    flowWidget ->setMinimumSize(1200,1200);
    int n=20;
    QVector <QPushButton *> buttons(n);

    for (int ii=0;ii<n;ii++)
    {
        QPushButton * pb = new QPushButton(); // creating buttons

           pb->setMinimumSize(200,200);
           buttons.push_back(pb); // adding buttons to qvector

           flowLayout->addWidget(pb);

    }

    QWidget *WindowWidget= new QWidget(this);
    WindowWidget->setMinimumSize(1000,1000);

    QVBoxLayout *WindowLayout = new QVBoxLayout(WindowWidget);

    QLabel *WindowHeading = new QLabel("Experimenting with Scrollbar in Flow Layout");

    WindowLayout->addWidget(WindowHeading);
    WindowLayout->setAlignment(WindowHeading,Qt::AlignLeft);
    WindowLayout->addWidget(flowWidget);
    
    QScrollArea *scroll =new QScrollArea();
    scroll->setWidget(WindowWidget);
    this->setCentralWidget(scroll);
    this->show();
} 

I am getting the desired result.

[Pl45m4]

@Swati777999

Where do you fill your vector with buttons? If you just have this code, you vector is empty.

Also change QVector<QPushButton> to
QVector<QPushButton * >

[Swati777999]

@Pl45m4 This is the entire code

    FlowLayout *flowLayout = new FlowLayout;
    int n=10;
    QVector <QPushButton> Buttons(n);

    for (int ii=0;ii<n;ii++)
    {
        flowLayout->addWidget(new QPushButton[ii]);

    }
    setLayout(flowLayout);

This one crashes.

[Swati777999]

@Pl45m4 said in Syntax for Vector of QPushbuttons added to FlowLayout:

Also change QVector<QPushButton> to
QVector<QPushButton * >

Done!

  FlowLayout *flowLayout = new FlowLayout;
    int n=10;
    QVector <QPushButton *> Buttons(n);

    for (int ii=0;ii<n;ii++)
    {
        flowLayout->addWidget(new QPushButton[ii]);

    }
    setLayout(flowLayout);

My program also crashed after this change --> QVector <QPushButton *> Buttons(n);

[Pl45m4]

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

FlowLayout *flowLayout = new FlowLayout;
int n=10;
QVector <QPushButton> Buttons(n);

for (int ii=0;ii<n;ii++)
{
    flowLayout->addWidget(new QPushButton[ii]);

}
setLayout(flowLayout);

Of course it crashes.
new QPushButton[ii] can't work.

So you want your buttons in your vector and then add them to your layout?!

Change your for-loop to something like this:

for(int ii =0; ii<n; ii++)
{
    QPushButton * pb = new QPushButton(); // create 10 Buttons
    buttons.push_back(pb); // add buttons to your qvector

   flowLayout->addWidget(pb);
}

[Swati777999]

@Pl45m4 said in Syntax for Vector of QPushbuttons added to FlowLayout:

> for(int ii =0; ii<n; ii++)
> {
>     QPushButton * pb = new QPushButton(); // create 10 Buttons
>     buttons.push_back(pb); // add buttons to your qvector
> 
>    flowLayout->addWidget(pb);
> }

Thanks for the suggestion, this works perfectly fine.
From the above code, I observed that some of my pushbuttons are clipped off from the bottom especially when the number of pushbuttons increases. So, I thought of introducing ScrollArea in my codes.

Here's my code CASE-1

#include<QScrollArea>
    FlowLayout *flowLayout = new FlowLayout;
    int n=20;
    QVector <QPushButton *> buttons(n);
    QScrollArea *scrollArea = new QScrollArea();

    for (int ii=0;ii<n;ii++)
    {
        QPushButton * pb = new QPushButton(); // creating buttons
          scrollArea->setWidget(pb);

           pb->setMinimumSize(200,200);
           buttons.push_back(pb); // adding buttons to qvector

           flowLayout->addWidget(pb);
    }

My program crashes because of it
scrollArea->setWidget(pb);

CASE-2

    FlowLayout *flowLayout = new FlowLayout;
    int n=20;
    QVector <QPushButton *> buttons(n);
    QScrollArea *scrollArea = new QScrollArea();

    for (int ii=0;ii<n;ii++)
    {
        QPushButton * pb = new QPushButton(); // creating buttons
          

           pb->setMinimumSize(200,200);
           buttons.push_back(pb); // adding buttons to qvector

           flowLayout->addWidget(pb);
    }
    scrollArea->setWidget(buttons);

The program crashes in this case also for obvious reasons.
scrollArea->setWidget(buttons); --> This statement is outright invalid as buttons is a QVector type not QWidget type.

Any suggestion to achieve the desired result?

[ChrisW67]

The primary suggestion is to read the documentation of QScrollArea. It starts:
"A scroll area is used to display the contents of a child widget within a frame. If the widget exceeds the size of the frame, the view can provide scroll bars so that the entire area of the child widget can be viewed. The child widget must be specified with setWidget()."

So, it contains and displays a single widget. That widget can contain child widgets in a layout (QGridLayout, QHBoxLayout or whatever). You may have to give the container a specific size depending on the widgetResizable property.
You want your buttons inside the widget that you place inside the QScrollArea.

[Swati777999]

@ChrisW67 said in Syntax for Vector of QPushbuttons added to FlowLayout:

The primary suggestion is to read the documentation of QScrollArea. It starts:
"A scroll area is used to display the contents of a child widget within a frame. If the widget exceeds the size of the frame, the view can provide scroll bars so that the entire area of the child widget can be viewed. The child widget must be specified with setWidget()."

So, it contains and displays a single widget. That widget can contain child widgets in a layout (QGridLayout, QHBoxLayout or whatever). You may have to give the container a specific size depending on the widgetResizable property.
You want your buttons inside the widget that you place inside the QScrollArea.

    {
       FlowLayout *flowLayout = new FlowLayout;
        int n=20;    
        QWidget *parentWidget =new QWidget(this);
        QGridLayout *parentLayout =new QGridLayout(parentWidget);
        parentWidget->setLayout(parentLayout);
    
        parentLayout->addLayout(flowLayout,0,0);  //Adding child layout to parentlayout
        QWidget *childWidget = new QWidget(); //Child Widget for flowLayout
    
        QVector <QPushButton *> buttons(n);
        QScrollArea *scrollArea = new QScrollArea();
   
        for (int ii=0;ii<n;ii++)
    
        {
    
            QPushButton * pb = new QPushButton(); // creating button    
               pb->setMinimumSize(200,200);  
               buttons.push_back(pb); // adding buttons to qvector
               flowLayout->addWidget(pb);
               childWidget->setLayout(flowLayout);
        }
        scrollArea->setWidget(childWidget);
        this->show();
}

I followed your instructions to modify my code but scrollArea operation does not seem to be working.

[JKSH]

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

scrollArea operation does not seem to be working.

You need to add some code that puts scrollArea into this.

[Swati777999]

@JKSH said in Syntax for Vector of QPushbuttons added to FlowLayout:

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

scrollArea operation does not seem to be working.

You need to add some code that puts scrollArea into this.

Do you mean that I should write QScrollArea *scrollArea= new QScrollArea(this);

[Swati777999]

@JKSH

This is the diagram of the parent-child items of the above code [expected output in the window]

So, you mean I should write
QScrollArea *scrollArea = new QScrollArea(parentWidget);
My program produces buttons in a vertical layout with deactivated scrollbar functionality.

[JKSH]

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

So, you mean I should write
QScrollArea *scrollArea = new QScrollArea(parentWidget);

According to your diagram,

• You should add the QPushButtons to flowLayout
• You should add flowLayout to ChildWidget
• You should add ChildWidget to ParentLayout
• You should add ParentLayout to ParentWidget

Can you point out to us: Which part of your code achieves each step?

[Swati777999]

@JKSH said in Syntax for Vector of QPushbuttons added to FlowLayout:
Find my answers below:
You should add the QPushButtons to flowLayout -
flowLayout->addWidget(pb); //inside the for loop

You should add flowLayout to ChildWidget
childWidget->setLayout(flowLayout); // Inside the for loop

You should add ChildWidget to ParentLayout
Missed this one in the above code but now I have included the following in my code
parentLayout->addWidget(childWidget); //Adding childWidget to parent layout
After including this code, I am not getting the result. :(

You should add ParentLayout to ParentWidget
parentWidget->setLayout(parentLayout);

[JKSH]

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

You should add the QPushButtons to flowLayout -
flowLayout->addWidget(pb); //inside the for loop

You should add flowLayout to ChildWidget
childWidget->setLayout(flowLayout); // Inside the for loop

You should add ChildWidget to ParentLayout
Missed this one in the above code but now I have included the following in my code
parentLayout->addWidget(childWidget); //Adding childWidget to parent layout
After including this code, I am not getting the result. :(

You should add ParentLayout to ParentWidget
parentWidget->setLayout(parentLayout);

Yep, these are all good. Next:

1. Where does QScrollArea fit in your widget hierarchy? (Remember that QScrollArea is a widget)
2. Why do you call childWidget->setLayout(flowLayout); multiple times?

[Swati777999]

@JKSH said in Syntax for Vector of QPushbuttons added to FlowLayout:

1. Where does QScrollArea fit in your widget hierarchy? (Remember that QScrollArea is a widget)
flowLayout ->addWidget(scrollArea); flowLayout is the child Layout.

2. Why do you call childWidget->setLayout(flowLayout); multiple times?
It's by mistake I wrote it. childWidget is the widget for flowLayout. Refer the following code.

    {   int n=20;
    QWidget *parentWidget =new QWidget(this);
    QGridLayout *parentLayout =new QGridLayout(parentWidget);
    parentWidget->setLayout(parentLayout);

    FlowLayout *flowLayout = new FlowLayout();
    parentLayout->addLayout(flowLayout,1,0);  //Adding child layout to parentlayout


    QWidget *childWidget = new QWidget(); //Child Widget for flowLayout
    parentLayout->addWidget(childWidget); //Adding childWidget to parent layout


    QVector <QPushButton *> buttons(n);
    QScrollArea *scrollArea = new QScrollArea(parentWidget);
    flowLayout ->addWidget(scrollArea);


    for (int ii=0;ii<n;ii++)
    {
        QPushButton * pb = new QPushButton(); // creating buttons
           pb->setMinimumSize(200,200);
           buttons.push_back(pb); // adding buttons to qvector
           flowLayout->addWidget(pb);
     }

    childWidget->setLayout(flowLayout);  //setting Layout for the childWidget

    scrollArea->setWidget(childWidget);
    scrollArea->widget()->setEnabled(true);
  
  this->show();
}

I get the following result after making the change. I don't know what the first box is.

[JKSH]

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

1. Where does QScrollArea fit in your widget hierarchy? (Remember that QScrollArea is a widget)
flowLayout ->addWidget(scrollArea); flowLayout is the child Layout.

Your code puts things in this order:

1. scrollArea inside flowLayout
2. flowLayout inside childWidget
3. childWidget inside scrollArea

So which of these objects is meant to be the one "outside"?

I suggest you update your diagram and include QScrollArea in the diagram.

[Swati777999]

@JKSH said in Syntax for Vector of QPushbuttons added to FlowLayout:

So which of these objects is meant to be the one "outside"?
I suggest you update your diagram and include QScrollArea in the diagram.

Here's the updated diagram for scrollArea, notice that the scrollArea Widget is in pink color.

[JKSH]

@Swati777999 said in Syntax for Vector of QPushbuttons added to FlowLayout:

Here's the updated diagram for scrollArea, notice that the scrollArea Widget is in pink color.

• According to your diagram, scrollArea is inside childWidget
• According to your code, childWidget is inside scrollArea.

Which one is correct?

Notes:

• I said this before: QScrollArea is a QWidget. You can't put a QScrollArea between your FlowLayout and your buttons.
• In case it's not obvious: QPushButton is also a QWidget.
• Your design is extremely complicated. I suggest you reduce the number of widgets and layouts.

[Swati777999]

@JKSH

I want to set the scrolling functionality for the array of pushbuttons. That's the reason why I put scrollArea inside the flowLayout.

[Pl45m4]

@Swati777999

And where do you want to have your flowLayout?
Your design is really confusing.

How about putting a widget with a flowLayout containing your buttons in your ScrollArea?!
Still don't know if that is what you are trying to achieve.
From you figure, it looks like you have a least 1 or 2 (parent) widgets and layouts more than necessarily needed.