QtQuick 2 - прозрачный фон окна

Я искал, как сделать фон моего приложения QtQuick 2.0 прозрачным. Большинство ответов, которые я нашел, используют QtDeclarative, что подходит для QtQuick 1.0, но не для версии 2.

Наконец, я нашел ответ, который опубликую, но хотел бы знать, есть ли лучший / более простой / меньший способ решения этой задачи.

Примечание *

Я хочу сделать фон окна прозрачным. Некоторые люди предлагают установить значение Opacity, но это делает все элементы qml прозрачными.


qt qml qtquick2 qt5
person George Sofianos    schedule 21.03.2014    source источник

Ответы (3)


arrow_upward
3
arrow_downward

Я нашел решение в этом сообщении http://qt-project.org/forums/viewthread/18984/#106629 пользователя billouparis. Он использует основной шаблон приложения, который генерируется QtCreator, что довольно удобно. Примечание. Я немного изменил исходный код, чтобы уменьшить его размер.

#include <QtGui/QGuiApplication>
#include "qtquick2applicationviewer.h"
#include <QSurface>
#include <QSurfaceFormat>
#include <QDebug>

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

    QtQuick2ApplicationViewer viewer;

    // Make Background Transparent Start
    viewer.setSurfaceType(QSurface::OpenGLSurface);

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

    viewer.setFormat(format);
    viewer.setColor(QColor(Qt::transparent));
    viewer.setClearBeforeRendering(true);
    // Make Background Transparent Stop

    viewer.setMainQmlFile(QStringLiteral("qml/myProject/main.qml"));
    viewer.showExpanded();
    return app.exec();
}

Также убедитесь, что корневой элемент qml имеет альфа-цвет (Qt.rgba)

person George Sofianos    schedule 21.03.2014
comment
Привет, Джордж, я считаю, что это сработает, даже если вы удалите строки, в которых используются QSurface и QSurfaceFormat. Это сделает ваш код еще проще. - person JKSH; 24.03.2014
comment
Привет, Джордж, я пробовал ваш код, но всегда получаю черный фон. Любая идея? - person nikvs; 29.05.2014
comment
В вашем qml файле прозрачный цвет вашего корневого элемента? - person George Sofianos; 30.05.2014

arrow_upward
2
arrow_downward

вот пример получения прозрачного окна без рамки в чистом qml

import QtQuick 2.2
import QtQuick.Window 2.0
import QtQuick.Controls 1.1
import QtQuick.Controls.Styles 1.1

ApplicationWindow {
    id: backlight
    flags: Qt.FramelessWindowHint
    visible: true
    title: qsTr("backlight")
    width: 500
    height: 50
    x: (Screen.width - width) / 2
    y: (Screen.height - height) / 2
    color: "transparent"

    property real slideValue
    signal onSlide(real value)

    Rectangle {
        anchors.centerIn: parent
        width: parent.width
        height: 50
        color: "transparent"

        Rectangle {
            anchors.fill: parent
            radius: 25
            opacity: 0.3
            color: "gray"
        }

        Slider {
            anchors.centerIn: parent
            width: backlight.width - 16
            height: backlight.height
            value: backlight.slideValue
            focus: true
            onValueChanged: backlight.onSlide(value)
            Keys.onSpacePressed: Qt.quit()
            Keys.onEscapePressed: Qt.quit()

            style: SliderStyle {
                groove: Rectangle {
                    implicitHeight: 8
                    radius: 4
                    color: "gray"
                }
                handle: Rectangle {
                    anchors.centerIn: parent
                    color: control.pressed ? "white" : "lightgray"
                    border.color: "gray"
                    border.width: 2
                    width: 34
                    height: 34
                    radius: 17
                }
            }
        }
    }
}
person bulldog68    schedule 10.05.2015

arrow_upward
1
arrow_downward

Попробуй это

import QtQuick 2.2
import QtQuick.Window 2.0


 Window {
    id: backlight

    visible: true
    title: qsTr("backlight")
    width: 500
    height: 50
    x: (Screen.width - width) / 2
    y: (Screen.height - height) / 2
    color: "transparent"


    }
person bulldog68    schedule 10.05.2015
comment
простота этого ответа делает его лучшим. работал на Qt 5.7, Quick 2.7, Win7 - person Mark Ch; 27.10.2016