Qt5 & QtQuick2 - transparent main window

Question

I am trying to create a simple Qt interface with a frameless window and rounded corners. Starting with a new project with the QtQuick 2 application template, my code is as follows:

main.cpp

#include <QtGui/QGuiApplication> #include "qtquick2applicationviewer.h" int main(int argc, char *argv[]) { QGuiApplication app(argc, argv); QtQuick2ApplicationViewer viewer; viewer.setMainQmlFile(QStringLiteral("qml/qtquick-test/main.qml")); viewer.setFlags(Qt::FramelessWindowHint); viewer.showExpanded(); return app.exec(); } 

main.qml

 import QtQuick 2.0 Rectangle { width: 360 height: 360 radius: 10 color: "red" Text { text: qsTr("Hello World") anchors.centerIn: parent } MouseArea { anchors.fill: parent onClicked: { Qt.quit(); } } } 

And this is the result:

What I do not need to do is get rid of the white corners by making the main window transparent. However, as far as I can tell, in Qt5 there is no way to do this, because we do not have style sheets, etc., And I do not use QtWidget. Should I use QtWidget?

Btw, I am new to Qt and Qt5.

Answer 1

This works for me under Windows 8 and Ubuntu 12.04.

 import QtQuick 2.3 import QtQuick.Window 2.2 Window { width: 300 height: 300 flags: Qt.FramelessWindowHint | Qt.Window color: "transparent" Rectangle { color: "brown" anchors.fill: parent anchors.margins: 10 } } 

Answer 2

You need to use viewer.setMask() in order to tell the QT widget that displays qml, where to draw and where not ....

I used mostly rectangular masks, but setMask accepts a QRegion, which I think supports more complex shapes and even a bitmap mask

Answer 3

Set the background highlight color to have alpha 0 on your viewer:

 viewer.setColor(QColor(0, 0, 0, 0));