Qt5 & QtQuick2 - transparent main window

问题:

I am trying to create a simple Qt UI with a frameless window and rounded corners. Starting from a new project with the QtQuick 2 Application template, my code looks like this:

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 wan't to do is get rid of the white corners, by making the main window transparent. However, as far as I can tell there is no way in Qt5 to do this, because we don't have stylesheets, etc and I am not using a QtWidget. Should I use a QtWidget?

Btw, I'm new to Qt and Qt5.

回答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
    }
}

回答2:

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

I've used mostly rectangular masks but setMask accepts a QRegion which i think supports more complicated forms and even bitmap mask

回答3:

Set the background clear color to have an alpha of 0 on your application viewer:

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