QGLWidget 上的透明 QGraphicsWebview 导致叠加图像答案

【问题标题】：Transparent QGraphicsWebview over QGLWidget leads to super imposed imagesQGLWidget 上的透明 QGraphicsWebview 导致叠加图像
【发布时间】：2014-11-05 11:03:58
【问题描述】：

我在QGraphicsView 中有一个透明的QGraphicsWebview，具有以下设置：

QGraphicsView 是高级小部件，以全屏模式显示
图形视图使用QGLWidget 作为其视图端口（使用opengl-es）
- 在这个 QGLWidget 中启用了 Alpha 通道和双缓冲
透明度由graphicsView->setStyleSheet("background:transparent") 实现
为 QGraphicsView 和 QGraphicsWebview 设置了以下属性
- WA_TranslucentBackground = true
- WA_NoSystemBackground = true
- WA_OpaquePaintEvent = 假
webview和webview->page()的QPalette::Base和QPalette::Window画笔设置为Qt::transparent

一开始，透明度工作正常。但是随着屏幕的更新（当我滚动时），看起来新的位图混合在现有的位图之上以获得叠加的图片。在大约 5-6 次屏幕更新后，这种混合会导致颜色累积并形成一个不透明的矩形（带有损坏的图像）。以下图片显示了问题的第一、第二和最后阶段。

如何告诉 qt/opengl 停止混合并将新图像绘制到帧缓冲区？我尝试从覆盖的 Webview::paint 和 GraphicsView::paintEvent 调用fillRect(boundRect(), Qt::transparent)；但它除了让更新变慢之外没有用。

我是 Qt 和 OpenGL 的新手，所以我可能会遗漏一些基本的标志或设置。

【问题讨论】：

标签： qt opengl opengl-es qgraphicsview qwebview

【解决方案1】：

我尝试了上面提到的所有方法。他们没有为我工作。然后我调试到 qtbase 代码，发现设置 Opacity 级别使顶部浏览器层透明。

this->setOpacity(0.1);

这个指针指向 QGraphicsWebView 对象。

使用此方法，包括背景在内的整个前端浏览器内容将是透明的。为了分离标题、段落和背景并为它们指定不同的透明级别，我将不得不深入研究 webkit 代码以找出问题所在。但就目前而言，setOpacity() 成功了，对于我正在做的事情来说已经足够了。

【讨论】：

【解决方案2】：

原来问题是graphicsView->setStyleSheet("background:transparent");。谁会猜到？！

是的，我认为让透明度起作用的那条线实际上给透明度带来了麻烦。没有该行（或者如果您将其更改为 background:none），应用程序可以正常工作

简而言之，使用 QGLWidget 获得透明 QGraphicsWebview 的步骤：

将QGraphicsWebview、QWebpage 和外部QGraphicsView 的基本调色板设置为Qt::transparent
scene->setBackgroundBrush(QBrush(Qt::transparent));

您还应该确保将 html 正文背景设置为透明值：

html, body {
  background-color: rgba(127, 127, 0, 0.5);
}

【讨论】：