Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. How to resize main window when bottom element's height change
Qt 6.11 is out! See what's new in the release blog

How to resize main window when bottom element's height change

Scheduled Pinned Locked Moved Solved QML and Qt Quick
resize
19 Posts 5 Posters 7.8k 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.
  • M MoaMoaK

    @mrjj
    Yep, fixing the widget size doesn't seems the way to go as the user might resize the window by himself (in that case, the video's aspect ratio might change obviously) and I would like the bar to stay hidden. So i would need to resize the widget on window resized event (might work but not convinced it's the best way though)

    I can't see how to reduce the bar's height without resizing the video, if you don't resize the window. So yes, i really need to resize the window I guess.

    mrjjM Offline
    mrjjM Offline
    mrjj
    Lifetime Qt Champion
    wrote on last edited by
    #6

    @MoaMoaK said in How to resize main window when bottom element's height change:

    resized event

    If you resize in resize event, it often leads to recursive crash.
    But you can emit a signal and do it a moment later in the slot.
    That should work.

    Just test it. it might not be optimal but could work.

    1 Reply Last reply
    0
    • M Offline
      M Offline
      MoaMoaK
      wrote on last edited by
      #7

      I'm replying after a while because I tryed a lot of stuff since, and I don't want to let this topic falling unanswered in the abyss of the forum. The best solution I've came up with so far is using the resize function on both the main window and the control bar.

      At the end of the post there is a working code of a fake video displayed with a control bar under it when the mouse hover the "video" for those interested. I've added an eventfilter to resize the "video" every time the main window is resized as this is how work my video (it made thing a bit harder)

      This version is working by using setMaximumHeight() on the control bar, it works because when the window is resized either the "video" takes more space or the control bar takes more space, qt choose to expand the bottom one. For more consistency, it's also possible to use setFixedHeight() on the controlBar but you can"t animate it as easily.

      main.cpp

      #include "mainwindow.hpp"
      #include <QApplication>
      
      int main(int argc, char *argv[])
      {
          QApplication a(argc, argv);
          MainWindow w;
          w.show();
      
          return a.exec();
      }
      

      mainwindow.hpp

      #ifndef MAINWINDOW_HPP
      #define MAINWINDOW_HPP
      
      #include <QMainWindow>
      #include <QtQml>
      
      #include <QtQuickWidgets/QQuickWidget>
      #include <QHBoxLayout>
      #include <QLabel>
      #include <QTimer>
      
      class MainWindow : public QMainWindow
      {
          Q_OBJECT
      
      public:
          MainWindow(QWidget *parent = 0);
          bool eventFilter(QObject *obj, QEvent *event);
          ~MainWindow();
      
      private:
          QPixmap *fakecontent;      // An image that acts as the video
          QLabel *video;             // The QWidget containing the "video"
          QQuickWidget *controlbar;  // The control bar in QML
          QVBoxLayout *vlayout;      // A layout for the video and the control bar
          QWidget *mainWidget;       // The main widget
      
          QTimer *timer;             // A timer for animation
          bool b_isexpanded;         // Is the control bar expanded
          QPropertyAnimation *animation;  // Animation when expanding control bar
      
      public slots :
          void collapseControlBar ();
          void expandControlBar();
      };
      
      #endif // MAINWINDOW_HPP
      

      mainwindow.cpp

      #include "mainwindow.hpp"
      
      MainWindow::MainWindow(QWidget *parent)
          : QMainWindow(parent)
      {
          setContentsMargins(0, 0, 0, 0);
      
          fakecontent = new QPixmap();
          fakecontent->load( "a/path/to/cute/kitten.jpg" );
      
          video = new QLabel();
          video->setPixmap( *fakecontent );
      
          b_isexpanded = false;
      
          controlbar = new QQuickWidget();
          controlbar->setSource( QUrl( QStringLiteral( "ControlBar.qml" )) );
          controlbar->setResizeMode(QQuickWidget::SizeRootObjectToView);
          controlbar->setMaximumHeight( 0 );
      
          vlayout = new QVBoxLayout( );
          vlayout->addWidget(video);
          vlayout->addWidget(controlbar);
      
          mainWidget = new QWidget();
          mainWidget->setLayout(vlayout);
      
          setCentralWidget(mainWidget);
      
          qApp->installEventFilter(this);
      
          timer = new QTimer();
          timer->setInterval(5000);
          connect( timer, SIGNAL(timeout()), this, SLOT(collapseControlBar()) );
      
          animation = new QPropertyAnimation(this, "size");
          animation->setDuration(300);
      }
      
      MainWindow::~MainWindow()
      {
          delete fakecontent;
          delete video;
          delete controlbar;
          delete vlayout;
          delete mainWidget;
          delete timer;
      }
      
      bool MainWindow::eventFilter(QObject *obj, QEvent *event)
      {
          if (obj == this && event->type() == QEvent::Resize)
          {
              video->setPixmap( fakecontent->scaled(video->size()) );
          }
          else if (obj == video && event->type() == QEvent::MouseMove)
          {
              expandControlBar();
          }
          return false;
      }
      
      void MainWindow::collapseControlBar()
      {
          this->resize(this->size().width(), video->size().height() + 20);
          b_isexpanded = false;
          controlbar->setMaximumHeight( 0 );
      }
      
      void MainWindow::expandControlBar()
      {
          if (b_isexpanded)
          {
              timer->stop();
              timer->start();
          }
          else
          {
              animation->setStartValue( this->size() );
              animation->setEndValue( QSize( this->size().width(), video->size().height() + 120 ) );
              animation->start();
      
              timer->start();
              b_isexpanded = true;
              controlbar->setMaximumHeight( 100 );
          }
      }
      

      ControlBar.qml

      import QtQuick 2.0
      
      Item {
          Rectangle {
              anchors.fill: parent
              color: "#00FF00"
          }
      }
      
      J.HilkJ A 2 Replies Last reply
      1
      • M MoaMoaK

        I'm replying after a while because I tryed a lot of stuff since, and I don't want to let this topic falling unanswered in the abyss of the forum. The best solution I've came up with so far is using the resize function on both the main window and the control bar.

        At the end of the post there is a working code of a fake video displayed with a control bar under it when the mouse hover the "video" for those interested. I've added an eventfilter to resize the "video" every time the main window is resized as this is how work my video (it made thing a bit harder)

        This version is working by using setMaximumHeight() on the control bar, it works because when the window is resized either the "video" takes more space or the control bar takes more space, qt choose to expand the bottom one. For more consistency, it's also possible to use setFixedHeight() on the controlBar but you can"t animate it as easily.

        main.cpp

        #include "mainwindow.hpp"
        #include <QApplication>
        
        int main(int argc, char *argv[])
        {
            QApplication a(argc, argv);
            MainWindow w;
            w.show();
        
            return a.exec();
        }
        

        mainwindow.hpp

        #ifndef MAINWINDOW_HPP
        #define MAINWINDOW_HPP
        
        #include <QMainWindow>
        #include <QtQml>
        
        #include <QtQuickWidgets/QQuickWidget>
        #include <QHBoxLayout>
        #include <QLabel>
        #include <QTimer>
        
        class MainWindow : public QMainWindow
        {
            Q_OBJECT
        
        public:
            MainWindow(QWidget *parent = 0);
            bool eventFilter(QObject *obj, QEvent *event);
            ~MainWindow();
        
        private:
            QPixmap *fakecontent;      // An image that acts as the video
            QLabel *video;             // The QWidget containing the "video"
            QQuickWidget *controlbar;  // The control bar in QML
            QVBoxLayout *vlayout;      // A layout for the video and the control bar
            QWidget *mainWidget;       // The main widget
        
            QTimer *timer;             // A timer for animation
            bool b_isexpanded;         // Is the control bar expanded
            QPropertyAnimation *animation;  // Animation when expanding control bar
        
        public slots :
            void collapseControlBar ();
            void expandControlBar();
        };
        
        #endif // MAINWINDOW_HPP
        

        mainwindow.cpp

        #include "mainwindow.hpp"
        
        MainWindow::MainWindow(QWidget *parent)
            : QMainWindow(parent)
        {
            setContentsMargins(0, 0, 0, 0);
        
            fakecontent = new QPixmap();
            fakecontent->load( "a/path/to/cute/kitten.jpg" );
        
            video = new QLabel();
            video->setPixmap( *fakecontent );
        
            b_isexpanded = false;
        
            controlbar = new QQuickWidget();
            controlbar->setSource( QUrl( QStringLiteral( "ControlBar.qml" )) );
            controlbar->setResizeMode(QQuickWidget::SizeRootObjectToView);
            controlbar->setMaximumHeight( 0 );
        
            vlayout = new QVBoxLayout( );
            vlayout->addWidget(video);
            vlayout->addWidget(controlbar);
        
            mainWidget = new QWidget();
            mainWidget->setLayout(vlayout);
        
            setCentralWidget(mainWidget);
        
            qApp->installEventFilter(this);
        
            timer = new QTimer();
            timer->setInterval(5000);
            connect( timer, SIGNAL(timeout()), this, SLOT(collapseControlBar()) );
        
            animation = new QPropertyAnimation(this, "size");
            animation->setDuration(300);
        }
        
        MainWindow::~MainWindow()
        {
            delete fakecontent;
            delete video;
            delete controlbar;
            delete vlayout;
            delete mainWidget;
            delete timer;
        }
        
        bool MainWindow::eventFilter(QObject *obj, QEvent *event)
        {
            if (obj == this && event->type() == QEvent::Resize)
            {
                video->setPixmap( fakecontent->scaled(video->size()) );
            }
            else if (obj == video && event->type() == QEvent::MouseMove)
            {
                expandControlBar();
            }
            return false;
        }
        
        void MainWindow::collapseControlBar()
        {
            this->resize(this->size().width(), video->size().height() + 20);
            b_isexpanded = false;
            controlbar->setMaximumHeight( 0 );
        }
        
        void MainWindow::expandControlBar()
        {
            if (b_isexpanded)
            {
                timer->stop();
                timer->start();
            }
            else
            {
                animation->setStartValue( this->size() );
                animation->setEndValue( QSize( this->size().width(), video->size().height() + 120 ) );
                animation->start();
        
                timer->start();
                b_isexpanded = true;
                controlbar->setMaximumHeight( 100 );
            }
        }
        

        ControlBar.qml

        import QtQuick 2.0
        
        Item {
            Rectangle {
                anchors.fill: parent
                color: "#00FF00"
            }
        }
        
        J.HilkJ Offline
        J.HilkJ Offline
        J.Hilk
        Moderators
        wrote on last edited by
        #8

        @MoaMoaK
        Hi, this may be a stupid question, but why do you want to resize the Video-Widget in the first place?

        You could make the toolbar and the bottom button-bar its own Widget and just place it on top of the video-widget. With varying decrees of transparency and Qt::FramelessWindowHint set to true.


        Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


        Q: What's that?
        A: It's blue light.
        Q: What does it do?
        A: It turns blue.

        M 1 Reply Last reply
        0
        • J.HilkJ J.Hilk

          @MoaMoaK
          Hi, this may be a stupid question, but why do you want to resize the Video-Widget in the first place?

          You could make the toolbar and the bottom button-bar its own Widget and just place it on top of the video-widget. With varying decrees of transparency and Qt::FramelessWindowHint set to true.

          M Offline
          M Offline
          MoaMoaK
          wrote on last edited by
          #9

          @J.Hilk
          At the end, I would like both possibilities implemented. Having the controls under the video, allows you to see every pixel of the screen while still being able to manipulate the controls. For instance, in some cases, you may want to examine frame by frame a specific section of the video that would appear under the controls else.

          1 Reply Last reply
          0
          • M MoaMoaK

            I'm replying after a while because I tryed a lot of stuff since, and I don't want to let this topic falling unanswered in the abyss of the forum. The best solution I've came up with so far is using the resize function on both the main window and the control bar.

            At the end of the post there is a working code of a fake video displayed with a control bar under it when the mouse hover the "video" for those interested. I've added an eventfilter to resize the "video" every time the main window is resized as this is how work my video (it made thing a bit harder)

            This version is working by using setMaximumHeight() on the control bar, it works because when the window is resized either the "video" takes more space or the control bar takes more space, qt choose to expand the bottom one. For more consistency, it's also possible to use setFixedHeight() on the controlBar but you can"t animate it as easily.

            main.cpp

            #include "mainwindow.hpp"
            #include <QApplication>
            
            int main(int argc, char *argv[])
            {
                QApplication a(argc, argv);
                MainWindow w;
                w.show();
            
                return a.exec();
            }
            

            mainwindow.hpp

            #ifndef MAINWINDOW_HPP
            #define MAINWINDOW_HPP
            
            #include <QMainWindow>
            #include <QtQml>
            
            #include <QtQuickWidgets/QQuickWidget>
            #include <QHBoxLayout>
            #include <QLabel>
            #include <QTimer>
            
            class MainWindow : public QMainWindow
            {
                Q_OBJECT
            
            public:
                MainWindow(QWidget *parent = 0);
                bool eventFilter(QObject *obj, QEvent *event);
                ~MainWindow();
            
            private:
                QPixmap *fakecontent;      // An image that acts as the video
                QLabel *video;             // The QWidget containing the "video"
                QQuickWidget *controlbar;  // The control bar in QML
                QVBoxLayout *vlayout;      // A layout for the video and the control bar
                QWidget *mainWidget;       // The main widget
            
                QTimer *timer;             // A timer for animation
                bool b_isexpanded;         // Is the control bar expanded
                QPropertyAnimation *animation;  // Animation when expanding control bar
            
            public slots :
                void collapseControlBar ();
                void expandControlBar();
            };
            
            #endif // MAINWINDOW_HPP
            

            mainwindow.cpp

            #include "mainwindow.hpp"
            
            MainWindow::MainWindow(QWidget *parent)
                : QMainWindow(parent)
            {
                setContentsMargins(0, 0, 0, 0);
            
                fakecontent = new QPixmap();
                fakecontent->load( "a/path/to/cute/kitten.jpg" );
            
                video = new QLabel();
                video->setPixmap( *fakecontent );
            
                b_isexpanded = false;
            
                controlbar = new QQuickWidget();
                controlbar->setSource( QUrl( QStringLiteral( "ControlBar.qml" )) );
                controlbar->setResizeMode(QQuickWidget::SizeRootObjectToView);
                controlbar->setMaximumHeight( 0 );
            
                vlayout = new QVBoxLayout( );
                vlayout->addWidget(video);
                vlayout->addWidget(controlbar);
            
                mainWidget = new QWidget();
                mainWidget->setLayout(vlayout);
            
                setCentralWidget(mainWidget);
            
                qApp->installEventFilter(this);
            
                timer = new QTimer();
                timer->setInterval(5000);
                connect( timer, SIGNAL(timeout()), this, SLOT(collapseControlBar()) );
            
                animation = new QPropertyAnimation(this, "size");
                animation->setDuration(300);
            }
            
            MainWindow::~MainWindow()
            {
                delete fakecontent;
                delete video;
                delete controlbar;
                delete vlayout;
                delete mainWidget;
                delete timer;
            }
            
            bool MainWindow::eventFilter(QObject *obj, QEvent *event)
            {
                if (obj == this && event->type() == QEvent::Resize)
                {
                    video->setPixmap( fakecontent->scaled(video->size()) );
                }
                else if (obj == video && event->type() == QEvent::MouseMove)
                {
                    expandControlBar();
                }
                return false;
            }
            
            void MainWindow::collapseControlBar()
            {
                this->resize(this->size().width(), video->size().height() + 20);
                b_isexpanded = false;
                controlbar->setMaximumHeight( 0 );
            }
            
            void MainWindow::expandControlBar()
            {
                if (b_isexpanded)
                {
                    timer->stop();
                    timer->start();
                }
                else
                {
                    animation->setStartValue( this->size() );
                    animation->setEndValue( QSize( this->size().width(), video->size().height() + 120 ) );
                    animation->start();
            
                    timer->start();
                    b_isexpanded = true;
                    controlbar->setMaximumHeight( 100 );
                }
            }
            

            ControlBar.qml

            import QtQuick 2.0
            
            Item {
                Rectangle {
                    anchors.fill: parent
                    color: "#00FF00"
                }
            }
            
            A Offline
            A Offline
            Ashutosh_Sachdeva
            wrote on last edited by
            #10

            @MoaMoaK
            Hi,
            I was trying to run the code provided by you but i'm facing an error with this header file
            **#include <QtQuickWidgets/QQuickWidget>

            " /home/ashutosh/Resize/mainwindow.hpp:6: error: QtQuickWidgets/QQuickWidget: No such file or directory
            #include <QtQuickWidgets/QQuickWidget>"

            I'm not able tp locate this header file i q libraries. Do we need to install any other plugins or something else.

            Thanks.

            jsulmJ 1 Reply Last reply
            0
            • A Ashutosh_Sachdeva

              @MoaMoaK
              Hi,
              I was trying to run the code provided by you but i'm facing an error with this header file
              **#include <QtQuickWidgets/QQuickWidget>

              " /home/ashutosh/Resize/mainwindow.hpp:6: error: QtQuickWidgets/QQuickWidget: No such file or directory
              #include <QtQuickWidgets/QQuickWidget>"

              I'm not able tp locate this header file i q libraries. Do we need to install any other plugins or something else.

              Thanks.

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

              @Ashutosh_Sachdeva What Qt version do you use?
              Also you should just include QQuickWidget:

              #include <QQuickWidget>
              

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

              1 Reply Last reply
              0
              • A Offline
                A Offline
                Ashutosh_Sachdeva
                wrote on last edited by
                #12

                @jsulm
                i'm using QT 5.12.1.

                I tried including only <QQuickWidget> but it's showing the same error

                jsulmJ 1 Reply Last reply
                0
                • A Ashutosh_Sachdeva

                  @jsulm
                  i'm using QT 5.12.1.

                  I tried including only <QQuickWidget> but it's showing the same error

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

                  @Ashutosh_Sachdeva How did you install Qt?

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

                  A 1 Reply Last reply
                  0
                  • jsulmJ jsulm

                    @Ashutosh_Sachdeva How did you install Qt?

                    A Offline
                    A Offline
                    Ashutosh_Sachdeva
                    wrote on last edited by
                    #14

                    @jsulm
                    https://wiki.qt.io/Install_Qt_5_on_Ubuntu

                    Through this link

                    jsulmJ 1 Reply Last reply
                    0
                    • A Ashutosh_Sachdeva

                      @jsulm
                      https://wiki.qt.io/Install_Qt_5_on_Ubuntu

                      Through this link

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

                      @Ashutosh_Sachdeva So, you used offline installer? And you really installed Qt 5.12.1, not 5.7?
                      Was there anything to select during installation?

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

                      1 Reply Last reply
                      0
                      • A Offline
                        A Offline
                        Ashutosh_Sachdeva
                        wrote on last edited by
                        #16

                        Hi,

                        Sorry it's 5.13.1.

                        Yes i used the offline installer and there were many option and i selected the latest one.

                        jsulmJ 1 Reply Last reply
                        0
                        • A Ashutosh_Sachdeva

                          Hi,

                          Sorry it's 5.13.1.

                          Yes i used the offline installer and there were many option and i selected the latest one.

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

                          @Ashutosh_Sachdeva Not sure, I don't use offline installer. My Qt setup was made via online installer and I have the headers.

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

                          A 1 Reply Last reply
                          0
                          • jsulmJ jsulm

                            @Ashutosh_Sachdeva Not sure, I don't use offline installer. My Qt setup was made via online installer and I have the headers.

                            A Offline
                            A Offline
                            Ashutosh_Sachdeva
                            wrote on last edited by
                            #18

                            @jsulm Ok

                            I have tried updating the lib. but that doesn't worked any other suggestion or solution?

                            jsulmJ 1 Reply Last reply
                            0
                            • A Ashutosh_Sachdeva

                              @jsulm Ok

                              I have tried updating the lib. but that doesn't worked any other suggestion or solution?

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

                              @Ashutosh_Sachdeva You can try online installer to install Qt. My Qt setup installed using online installer has this header file.
                              Also as stated in your other thread make sure you have

                              QT += quickwidgets
                              

                              in your pro file.

                              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
                              • Unsolved