Transparent widget with QtQuick 2.0

Question

I am trying to create a transparent window with QtQuick 2.0.

I can create a transparent widget:

class TransparentWidget : public QWidget { public: TransparentWidget(QWidget* parent) : QWidget(parent) { resize(QSize(500, 500)); setAttribute(Qt::WA_TranslucentBackground); setWindowFlags(Qt::FramelessWindowHint); } void paintEvent(QPaintEvent * event) { QPainter painter; QBrush brush(Qt::cyan); painter.begin(this); painter.setRenderHint(QPainter::Antialiasing); painter.setBrush(brush); painter.drawRect(0,0,100,100); painter.end(); } }; 

Now I want to do the same with QQuickView, first create it:

 QQuickView view; view.setSource(QUrl::fromLocalFile("test.qml")); view.setResizeMode(QQuickView::SizeRootObjectToView); 

and here is my test.qml file:

 Rectangle { width: 300; height: 300; color: "transparent"; Rectangle { anchors.top: parent.top; anchors.left: parent.left; width: 50; height: 100; color: "lightsteelblue"; } Rectangle { anchors.bottom: parent.bottom; anchors.right: parent.right; width: 50; height: 100; color: "darkgrey"; } } 

Now I want to create a transparent widget, and I did it like this:

 QWidget *p = QWidget::createWindowContainer(&view, NULL, Qt::FramelessWindowHint); p->setAttribute(Qt::WA_TranslucentBackground); p->show(); 

I create a widget with WA_TranseculentBackground and FramelessWindowHint in the same way as with the previous one, but this did not work.

The deeper and pix is ​​used to see what QQuickView calls, and I see this line:

now my questions are:

1 - Why does Qt call IDirect3DDevice9 :: clear with white color?

2 Is there a way to tell QQuickView or QmlEngine not to draw anything else?

Answer 1

Transparency with QtQuick2 works with Qt 5.2, at least for Windows (for both Angle and OpenGL):

Create view:

 QQuickView view; view.setOpacity(0.9999); view.setColor( Qt::transparent ); view.setSource( QUrl::fromLocalFile( QLatin1String( "Main.qml" ) ) ); 

No additional style / attribute / flag calls are required except setOpacity and setColor. "Main.qml" should set the transparency correctly, just like your QML example:

 Rectangle { color: "transparent" }