CODEWITHSUNDEEP
c++qtqml
Vii
Vii

Reputation: 841

Qml / Qt / C++ : QQuickView in a QWidget - Need Background Transparency

I am trying to get my container with a qquickview in it to be transparent, and only display the elements from the QML file without the background.

Is there a nicer way to implement this? Here is the relevant code, you can see I have commented out adding the QML to it so that the only offender is the QWidget containing a QQuickView

The QML will make a menu similar to Apple's "Cover Flow" using only text. I only want the text it generates to be visible.

Currently it has a solid white background.

QQuickView *view = new QQuickView();
QWidget *container = QWidget::createWindowContainer(view, this);
container->setObjectName("wrappingContainer");
container->setMinimumSize(1000, 240);
container->setMaximumSize(1000, 240);
container->setFocusPolicy(Qt::TabFocus);

//view->setSource(QUrl("qrc:/qml/wrappingMenu.qml"));
ui->testLayout->addWidget(container);

Upvotes: 4

Views: 6116

Answers (3)

Predrag Manojlovic
Predrag Manojlovic

Reputation: 378

You can do it with:

QQuickView view;
view.setColor(Qt::transparent);
view.setSource("main.qml");

Upvotes: 0

Mitch
Mitch

Reputation: 24416

Try QQuickWidget:

#include <QtWidgets>
#include <QQuickWidget>

class Widget : public QWidget
{
    Q_OBJECT
public:
    Widget() {
        setStyleSheet("background-color: 'grey';");
        mQQuickWidget = new QQuickWidget(QUrl(QStringLiteral("main.qml")), this);
        mQQuickWidget->setResizeMode(QQuickWidget::SizeRootObjectToView);
        mQQuickWidget->setAttribute(Qt::WA_AlwaysStackOnTop);
        mQQuickWidget->setClearColor(Qt::transparent);
        mQQuickWidget->resize(400, 400);
        mQQuickWidget->raise();
    }
private:
    QQuickWidget *mQQuickWidget;
};

int main(int argc, char** argv)
{
    QApplication app(argc, argv);
    Widget widget;
    widget.resize(400, 400);
    widget.show();
    return app.exec();
}

#include "main.moc"

main.qml:

import QtQuick 2.2

Item {
    Text {
        text: "Qt Quick Text"
        font.pixelSize: 32
        anchors.centerIn: parent
    }
}

enter image description here

Upvotes: 5

Nejat
Nejat

Reputation: 32695

I doubt it could be done for a QQuickView embedded in a QWidget. But you can have a transparent QQuickView like :

QQuickView view;

view.setSurfaceType(QSurface::OpenGLSurface);

QSurfaceFormat format;
format.setAlphaBufferSize(8);
format.setRenderableType(QSurfaceFormat::OpenGL);

view.setFormat(format);
view.setColor(QColor(Qt::transparent));
view.setClearBeforeRendering(true);

view.setFlags(Qt::FramelessWindowHint);

view.setSource(QStringLiteral("qrc:/qml/wrappingMenu.qml"));

view.show();

Upvotes: 1

Related Questions