Question

也许这是一个错误。有一个必须有投影的顶级窗口小部件。在该小部件内部，我想显示一个浏览器（只能呈现html）。顶级窗口小部件的不透明度必须是可调整的。为了让阴影按预期工作（不显示黑色边框），我们需要将Qt::WA_TranslucentBackground设置为true。但是，不透明度的改变不起作用。为什么？但真正困扰我的是，如果您将浏览器小部件替换为任何其他小部件，比如QTextEdit，则不透明度的更改始终有效，包括使用投影。

我在Windows 8.1主机上使用Qt5.8和msvc2015。这是一个有用的最小例子：

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QWidget>
#include <QWebEngineView>
#include <QWebEnginePage>
#include <QVBoxLayout>
#include <QSlider>
#include <QGraphicsDropShadowEffect>

class TestWidget : public QWidget
{
    Q_OBJECT
public:
    explicit TestWidget(QWidget *parent = 0){
        this->setStyleSheet(".QWidget{color: qlineargradient(spread:pad, x1:0 y1:0, x2:1 y2:0, stop:0 rgba(0, 0, 0, 255), stop:1 rgba(255, 255, 255, 255));"
                               "background: qlineargradient( x1:0 y1:0, x2:1 y2:0, stop:0 cyan, stop:1 blue);}");

        QWebEngineView *view = new QWebEngineView;
        view->setUrl( QUrl("https://www.google.de") );
        this->setLayout(new QVBoxLayout);

        view->page()->setBackgroundColor(QColor(Qt::transparent));

        QWidget *container = new QWidget;
        container->setLayout( new QVBoxLayout );
        container->layout()->setContentsMargins(0,0,0,0);
        container->layout()->addWidget( view );
        this->layout()->addWidget( container );

        QSlider *slider = new QSlider;
        slider->setOrientation(Qt::Horizontal);
        slider->setFixedWidth(200);
        slider->setMinimum(20);
        slider->setValue(20);
        slider->setMaximum(100);
        connect(slider,&QSlider::valueChanged,this,
                [this](int value){
            this->setWindowOpacity(1.0 * value / 100.0);
        });
        slider->show();

        this->setAttribute(Qt::WA_TranslucentBackground,true);
        Qt::WindowFlags flags = 0;
        flags |= Qt::SplashScreen;
        flags |= Qt::FramelessWindowHint;
        setWindowFlags(flags);

        QGraphicsDropShadowEffect *shadow = new QGraphicsDropShadowEffect;
        shadow->setBlurRadius(10);
        shadow->setOffset(0,2);
        shadow->setEnabled(true);
        setGraphicsEffect(shadow);
    }

    ~TestWidget(){}
};

#endif // MAINWINDOW_H

专业档案：

QT       += core gui webenginewidgets

greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

TARGET = transparent-webpage-over-widget
TEMPLATE = app

# The following define makes your compiler emit warnings if you use
# any feature of Qt which as been marked as deprecated (the exact warnings
# depend on your compiler). Please consult the documentation of the
# deprecated API in order to know how to port your code away from it.
DEFINES += QT_DEPRECATED_WARNINGS

# You can also make your code fail to compile if you use deprecated APIs.
# In order to do so, uncomment the following line.
# You can also select to disable deprecated APIs only up to a certain version of Qt.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0


SOURCES += main.cpp

HEADERS  += mainwindow.h

Answer 1

正如https://bugreports.qt.io/browse/QTBUG-41960中所提到的，现在只需使用这一行就可以了：

webEngineView->page()->setBackgroundColor(Qt::transparent);

我在Qt 5.6中尝试过它并且效果很好。

为了使这个答案更有帮助，让我展示所有相关的代码。

在MainWindow中，我设置了这个：

setAttribute(Qt::WA_TranslucentBackground);
setAutoFillBackground(true);
setWindowFlags(Qt::FramelessWindowHint);

对于webEngineView对象，我设置了以下属性：

webEngineView->setAttribute(Qt::WA_TranslucentBackground);
webEngineView->setStyleSheet("background:transparent");
webEnginePage = webEngineView->page();
// https://bugreports.qt.io/browse/QTBUG-41960
webEnginePage->setBackgroundColor(Qt::transparent);

在您的HTML中，在CSS中使用透明背景，如下所示：

body { background: transparent; }

否则，我认为默认情况下HTML会有白色背景

我希望它有所帮助。

不透明度不适用于QWebEngineView和半透明背景

1 个答案: