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. How to create a Grid Layout, containing images and labels, as Widget Layout of Vertical Scrollable Area
QtWS25 Last Chance

How to create a Grid Layout, containing images and labels, as Widget Layout of Vertical Scrollable Area

Scheduled Pinned Locked Moved Solved General and Desktop
7 Posts 3 Posters 2.0k Views
  • 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.
  • cppStudent012C Offline
    cppStudent012C Offline
    cppStudent012
    wrote on last edited by cppStudent012
    #1

    Hi everyone.

    I'm new of Qt and I just started to make the GUI of my project but I'm stuck on the Scroll Area part.

    Since the concept of what I'd like to do is a bit complicated I did sketched it with paint (with my awesome paint skills!!):

    0_1547157521979_explaination.png

    To achieve this result I managed to create the Scroll Area in this way:

    @

    QScrollArea*SA = new QScrollArea(this);
    SA ->setGeometry(100,64,352,250);
    SA ->verticalScrollBar()->setStyleSheet("QScrollBar {height:0px;}");
    
    QVBoxLayout* VBL = new QVBoxLayout;
    VBL ->setMargin(0);
    VBL ->setSpacing(0);
    
    QWidget* containerWidget = new QWidget;
    containerWidget->setLayout(VBL);
    SA ->setWidget(containerWidget);
    

    @

    I'm stuck at this point. At the moment some QPushButtons were added (VBL->setWidget(QPushButton);) to test if everything was working fine and it does, but the widget I'd like to add is the whole Object of the Scrollable Area shown in the picture.

    Does anyone have any idea about how to create this?

    Thank you in advance!

    jsulmJ 1 Reply Last reply
    1
    • cppStudent012C cppStudent012

      Hi everyone.

      I'm new of Qt and I just started to make the GUI of my project but I'm stuck on the Scroll Area part.

      Since the concept of what I'd like to do is a bit complicated I did sketched it with paint (with my awesome paint skills!!):

      0_1547157521979_explaination.png

      To achieve this result I managed to create the Scroll Area in this way:

      @

      QScrollArea*SA = new QScrollArea(this);
      SA ->setGeometry(100,64,352,250);
      SA ->verticalScrollBar()->setStyleSheet("QScrollBar {height:0px;}");
      
      QVBoxLayout* VBL = new QVBoxLayout;
      VBL ->setMargin(0);
      VBL ->setSpacing(0);
      
      QWidget* containerWidget = new QWidget;
      containerWidget->setLayout(VBL);
      SA ->setWidget(containerWidget);
      

      @

      I'm stuck at this point. At the moment some QPushButtons were added (VBL->setWidget(QPushButton);) to test if everything was working fine and it does, but the widget I'd like to add is the whole Object of the Scrollable Area shown in the picture.

      Does anyone have any idea about how to create this?

      Thank you in advance!

      jsulmJ Offline
      jsulmJ Offline
      jsulm
      Lifetime Qt Champion
      wrote on last edited by
      #2

      @cppStudent012 I'm not sure what the problem is. For each of these objects inside the scrollable area you can simply insert a widget (and add this widget to the layout) and on this widget you put all the elements (don't forget to add a layout to this widget).
      So:

      QScrollarea:
          QWidget:
              QVBoxLayout:
                  QWidget:
                      Q*Layout (check which layout is the proper one for your use case):
                          picture
                          ...
      

      https://forum.qt.io/topic/113070/qt-code-of-conduct

      cppStudent012C H 2 Replies Last reply
      2
      • jsulmJ jsulm

        @cppStudent012 I'm not sure what the problem is. For each of these objects inside the scrollable area you can simply insert a widget (and add this widget to the layout) and on this widget you put all the elements (don't forget to add a layout to this widget).
        So:

        QScrollarea:
            QWidget:
                QVBoxLayout:
                    QWidget:
                        Q*Layout (check which layout is the proper one for your use case):
                            picture
                            ...
        
        cppStudent012C Offline
        cppStudent012C Offline
        cppStudent012
        wrote on last edited by
        #3

        @jsulm Thank you for answering!

        I didn't understand that every single Layout object had to be wrapped in a QWidget one.

        Everything works fine in the way you said!

        Thank you very much!

        1 Reply Last reply
        0
        • jsulmJ jsulm

          @cppStudent012 I'm not sure what the problem is. For each of these objects inside the scrollable area you can simply insert a widget (and add this widget to the layout) and on this widget you put all the elements (don't forget to add a layout to this widget).
          So:

          QScrollarea:
              QWidget:
                  QVBoxLayout:
                      QWidget:
                          Q*Layout (check which layout is the proper one for your use case):
                              picture
                              ...
          
          H Offline
          H Offline
          harveyab
          wrote on last edited by
          #4

          @jsulm My case is similar, but my question is what parts (wigiets and/or layouts) get repeated, for several objects of the scrollable area?

          jsulmJ 1 Reply Last reply
          0
          • H harveyab

            @jsulm My case is similar, but my question is what parts (wigiets and/or layouts) get repeated, for several objects of the scrollable area?

            jsulmJ Offline
            jsulmJ Offline
            jsulm
            Lifetime Qt Champion
            wrote on last edited by
            #5

            @harveyab It depends on what you want to do. Since I don't know what you want to do I can't tell you. In general: widgets can contain other widgets and layouts same goes for layouts, so you can do what ever you want.

            https://forum.qt.io/topic/113070/qt-code-of-conduct

            H 1 Reply Last reply
            0
            • jsulmJ jsulm

              @harveyab It depends on what you want to do. Since I don't know what you want to do I can't tell you. In general: widgets can contain other widgets and layouts same goes for layouts, so you can do what ever you want.

              H Offline
              H Offline
              harveyab
              wrote on last edited by
              #6

              @jsulm Thanks for your response. So in his example as given in his drawing, what part of your answer gets repeated for the items that are "listed" in the scrolling area? I understand that the classes are not repeating, but I mean there are multiple instances of some classes. At what point do the instances have multiples? Is it the QVBoxLayout, the widget above it, or does it start with the widget below it? I have other questions, but I need to start somewhere. In my case I will have one picture file open, but in each listed item, I will have a part of that one picture showing, and some editable text with each. In what class do I open the image file? Do I 'get' the image part from below, or do I 'set' the image part from above? Does that make sense?

              jsulmJ 1 Reply Last reply
              0
              • H harveyab

                @jsulm Thanks for your response. So in his example as given in his drawing, what part of your answer gets repeated for the items that are "listed" in the scrolling area? I understand that the classes are not repeating, but I mean there are multiple instances of some classes. At what point do the instances have multiples? Is it the QVBoxLayout, the widget above it, or does it start with the widget below it? I have other questions, but I need to start somewhere. In my case I will have one picture file open, but in each listed item, I will have a part of that one picture showing, and some editable text with each. In what class do I open the image file? Do I 'get' the image part from below, or do I 'set' the image part from above? Does that make sense?

                jsulmJ Offline
                jsulmJ Offline
                jsulm
                Lifetime Qt Champion
                wrote on last edited by
                #7

                @harveyab Everything bellow QScrollarea is repeated as often as needed.
                It really depends on your use case. If you want to have exact answer then you have to ask a precise question.

                https://forum.qt.io/topic/113070/qt-code-of-conduct

                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