Resize Qml window

Question

In my project I created a transparent and frameless QMainWindow, then created QmlApplicationViewer. I need to be able to drag and resize the window. How can I do?

Answer 1

This app is a small variation of the one presented here to deal with transparent windows in QML applications:

win.cpp:

#include <QApplication>
#include <QDeclarativeView>
#include <QMainWindow>
#include <QDeclarativeContext>

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

    QMainWindow window;

    QDeclarativeView* v = new QDeclarativeView;
    window.setCentralWidget(v);

    v->setSource(QUrl::fromLocalFile(("draw_rectangles.qml")));   

    // expose window object to QML
    v->rootContext()->setContextProperty("mainwindow",&window);

    window.setStyleSheet("background:transparent;");
    window.setAttribute(Qt::WA_TranslucentBackground);
    window.setWindowFlags(Qt::FramelessWindowHint);
    window.show();

    app.exec();
}

win.pro:

TEMPLATE += app
QT += gui declarative
SOURCES += win.cpp

draw_rectangles.qml:

import Qt 4.7

Item {
     Rectangle {
         opacity: 0.5
         color: "red"
         width: 100; height: 100

         MouseArea {
            anchors.fill: parent
            onPressed: {
                mainwindow.size.width = 200;
                mainwindow.size.height = 500;
            }
         }

         Rectangle {
             color: "blue"
             x: 50; y: 50; width: 100; height: 100

            MouseArea {
                id: mouseRegion
                anchors.fill: parent;
                property variant clickPos: "1,1"

                onPressed: {
                    clickPos  = Qt.point(mouse.x,mouse.y)
                }

                onPositionChanged: {
                    var delta = Qt.point(mouse.x-clickPos.x, mouse.y-clickPos.y)
                    mainwindow.pos = Qt.point(mainwindow.pos.x+delta.x,
                                      mainwindow.pos.y+delta.y)
                }
            }
         }
     }
 }

Even though you are not interested in transparency, this app shows how to expose QMainWindow to QML. This allows the QML application to make changes in the main window.

Click on the blue rectangle to drag the window around, and click on the red rectangle to resize the window using hardcoded values in the qml. Of course, as the window is transparent you won't have the visual feedback of a regular opaque application when you resize it. But the resize operation works, though. Enjoy!