QScrollArea with QGridLayout

  • I currently have a QGridLayout that is used to show a table of data, but I would only like to show around 3x5 cells, and allow for the rest of them to be scrolled to as needed. After reading up on using QScrollArea with QGridLayout, I ended up with this...
    QScrollArea *scrollArea = new QScrollArea();
    QWidget *container = new QWidget(scrollArea);
    QGridLayout *gridEPG = new QGridLayout(container);
    ui->gridLayout->addWidget(w, 1, 0, 1, 3);
    //ui->gridLayout->addLayout(gridEPG, 1, 0, 1, 3);
    It displays fine, but as the scrolling doesn't work. As I add/remove elements from the "gridEPG" layout, it simply shrinks/expands everything to fit. What changes need to be set so that I can actually make it display X by X cells and scroll to the rest?

  • You need to apply the layout (QWidget::setLayout()) to the container widget and give it some definite size. It look like you are trying to do a programme guide so you might set the width of container to 24x pixels to give yourself x pixels per hour.

  • Hi Chris,

    Thank you so much. I realized after you pointed that out that I was also still assigning the container widget to my main form's grid layout. Once I set the layout as you mentioned on my container widget and instead assigned the scroll area to my main form layout (instead of the container) it worked perfectly.

    I am still a bit confused on the sizing. As my EPG grid (and scroll area) are part of a larger grid that resize it when the window is resized, I can't set a static size for it. I would however like to set it so no matter what the window is resized to, it always shows the 3 columns and 5 rows, just in different sizes, then scrolling simply slides over by 1 column or 1 row. How would that be done?

  • The QScrollArea is resized by the layout you insert it into. The widget inside the QScrollArea has a size independent of the QScrollArea's size. When that size is larger than the viewport you get scroll bars, otherwise you do not.

    #include <QtGui>
    #include <QDebug>

    class MainWidget: public QWidget {
    MainWidget(QWidget *p = 0): QWidget(p) {
    // Fake up a grid to scroll
    QWidget *client = new QWidget(this);
    QGridLayout *gl = new QGridLayout(client);
    for (int row = 0; row < 5; ++row) {
    for (int col = 0; col < 24; ++col) {
    QLabel *l = new QLabel(QString("R%1 C%2").arg(row).arg(col), client);
    l->setFixedSize(100, 40); // makes the whole client widget abut 2400 px wide
    gl->addWidget(l, row, col);

        // Put it into a scroll area
        QScrollArea *area = new QScrollArea(this);
        // Make the scroll step the same width as the fixed widgets in the grid
        area->horizontalScrollBar()->setSingleStep(client->width() / 24);
        QVBoxLayout *layout = new QVBoxLayout(this);
        layout->addWidget(new QLabel("Something else", this));

    public slots:

    int main(int argc, char *argv[])
    QApplication app(argc, argv);

    MainWidget m;
    return app.exec&#40;&#41;;

    #include "main.moc"

  • Thanks for the code snippet Chris. I posted my own here http://qt-project.org/forums/viewthread/20924/ (made a new thread since it was pretty massive) and I am still at a loss. When I made a new project and tried your project it was all jumbled up in the top left corner.

    My code snippet and screenshot show the issue I am having, but still just not sure where its wrong. I noticed your code is a little different from mine in terms of how it is ordered, but everything is being done the same way as far as I can tell. I just can't figure out why mine is causing the columns to overlap each other rather than just spreading out and making horizontal scroll bars.

Log in to reply