背景图像上带有 Alpha 通道叠加的视频：Alpha 显示黑色答案

【问题标题】：Video with alpha channel overlay on background image: Alpha shows black背景图像上带有 Alpha 通道叠加的视频：Alpha 显示黑色
【发布时间】：2021-09-27 11:26:31
【问题描述】：

我需要在场景中播放带有 Alpha 通道的 .mov 视频 (ProRes4444)。场景有一个背景图像，我需要使用视频的 Alpha 通道，以便它覆盖在背景上。

如果我用 QMediaPlayer 正常打开视频，alpha 通道显示为黑色。

带有背景图片的屏幕和带有黑色 alpha 的视频：

如何使 QMediaPlayer (QGraphicsVideoItem) 的输出尊重 alpha 并使叠加效果成为可能？

根据在线研究，我最接近答案的是 cpp 中的代码，我发现它显示了创建 QAbstractVideoSurface 的子类的必要性，该子类接收视频帧并转换为 ARGB，然后将它们转发到显示它们的 QLabel .

Displaying a video with an alpha channel using qt

我也尝试过，但没有成功。这是正确的课程还是我只是在我当前的代码中遗漏了一些简单的东西？

编辑：链接到文件（背景图像和视频 .mov） https://drive.google.com/drive/folders/1LIZzTg1E8wkaD0YSvkkcfSATdlDTggyh?usp=sharing

import sys
from PyQt5.QtMultimedia import *
from PyQt5.QtMultimediaWidgets import *
from PyQt5.QtWidgets import *
from PyQt5.QtCore import *
from PyQt5.QtGui import *


class VideoWindow(QMainWindow):
     def __init__(self):
        super(VideoWindow, self).__init__()
        self.setWindowTitle('QMediaPlayer TEST')
        self.resize(1920, 1080)

        self.vista = QGraphicsView(self)
        self.vista.setGeometry(QRect(0, 0, 1920, 1080))

        self.scene = QGraphicsScene(self.vista)
        self.scene.setSceneRect(0, 0, 1920, 1080)
        self.vista.setScene(self.scene)

        self.graphvitem1 = QGraphicsVideoItem()

#SET BACKGROUND IMAGE ON SCENE
        self.tempImg = QPixmap("/Users/elemental/Desktop/pyvids/fons.jpeg")
        self.tempImg = self.tempImg.scaled(self.scene.width(), self.scene.height())
        self.graphicsPixmapItem = QGraphicsPixmapItem(self.tempImg)
        self.scene.addItem(self.graphicsPixmapItem)

#SET VIDEO 1 WITH LOOP
        self.mediaPlayer1 = QMediaPlayer(None, QMediaPlayer.VideoSurface)
        self.mediaPlayer1.setVideoOutput(self.graphvitem1)

        self.playlist1 = QMediaPlaylist(self)
        self.playlist1.addMedia(QMediaContent(QUrl.fromLocalFile("/Users/elemental/Desktop/pyvids/vida1.mov")))
        self.playlist1.setCurrentIndex(1)
        self.playlist1.setPlaybackMode(QMediaPlaylist.CurrentItemInLoop)
        self.mediaPlayer1.setPlaylist(self.playlist1)

        self.graphvitem1.setPos(500, 100)
        self.graphvitem1.setSize(QSizeF(1000, 500))
        self.scene.addItem(self.graphvitem1)

        self.mediaPlayer1.play()
        self.vista.show()


if __name__ == '__main__':
     app = QApplication([])
     window = VideoWindow()
     window.show()
     sys.exit(app.exec_())

【问题讨论】：

这在 Python 中似乎是可行的（但有一些性能损失）。无论如何，这是一种非常奇特的格式，你有一个基本文件可以与我们分享，如果有人可以移植它也可以测试它吗？
注意：您说您“尝试过没有成功”，那么我建议您提供该尝试，因为我们可能能够理解您是否正确地做到了。也就是说，一个问题：该视频是“静态”和预定义的动画吗？因为如果是这种情况，那么您可能会选择其他更简单的解决方案，例如使用带有 QMovie 的 GIF 或 PNG 图像列表。
@musicamante 我仍在尝试找出最好的容器和编解码器，但到目前为止，我正在尝试使用 ProRes4444 进行 mov。如果为此目的还有其他更好的方法，我可以切换。目标是构建一个大型 4k 主 UI，播放不同（和更小）的高分辨率动画/视频，Alpha 通道在不同的位置，而且，我必须能够将它们暂停到特定点并恢复播放。如果png对cpu，gpu的影响较小，那么肯定是探索的方式。而且，如果我最终使用视频文件进行升级，我愿意升级到任何必要的硬件以避免任何性能问题
@musicamante 当我说“尝试不成功”时，我的意思是我试图将 cpp 代码“翻译”成 python，但是我对 PyQt 的了解仍然非常有限，所以我中途卡住了决定放弃这条路线并在将几个小时用于我不确定它是否会成功或实用的事情之前征求意见。所以，“不成功”……
@musicamante 添加了下载视频和背景图片的链接。非常感谢您的意见！

标签： python pyqt5 alpha qgraphicsview qvideowidget

【解决方案1】：

据我所知，QVideoWidget 默认不支持 alpha 通道，因此它回退到“基本”黑色背景。

但是，通过适当地继承 QAbstractVideoSurface，实现似乎是可能的。

考虑到以下代码是实验性的，我对 QMediaPlayer 和 Qt 视频表面的了解并不那么深入（前者是对多个平台和多个库的抽象，它们在不同配置下的行为可能会有很大差异），我可以只在两个Linux平台上测试过，不知道在Windows和MacOS下表现如何。

假设视频表面提供了一个默认的专用 QWidget 子类 (VideoWidget)，除非提供了具有合适 setImage 的另一个类，并在媒体播放器需要时更新其 image。

请注意，我只用几个视频（包括提供的视频）对其进行了测试，可能需要进一步测试。

from PyQt5.QtMultimedia import *
from PyQt5.QtMultimediaWidgets import *
from PyQt5.QtWidgets import *
from PyQt5.QtCore import *
from PyQt5.QtGui import *

class VideoWidget(QWidget):
    image = QImage()
    def __init__(self, **kwargs):
        super().__init__(**kwargs)

    def setImage(self, image):
        self.image = image
        self.update()

    def sizeHint(self):
        return QSize(640, 480)

    def paintEvent(self, event):
        qp = QPainter(self)
        # ensure that smooth transformation is used while scaling pixmaps
        qp.setRenderHints(qp.SmoothPixmapTransform)

        # provide compliancy with background set using stylesheets, see:
        # https://doc.qt.io/qt-5/stylesheet-reference.html#qwidget-widget
        opt = QStyleOption()
        opt.initFrom(self)
        self.style().drawPrimitive(QStyle.PE_Widget, opt, qp, self)

        # draw the image, scaled to the widget size; if you need fixed sizes
        # or keep aspect ratio, implement this (or the widget) accordingly
        qp.drawImage(self.rect(), self.image, self.image.rect())


class AlphaVideoDrawer(QAbstractVideoSurface):
    def __init__(self, videoWidget=None, widgetOptions=None):
        super().__init__()
        if videoWidget:
            if not hasattr(videoWidget, 'setImage'):
                raise NotImplementedError(
                    'setImage() must be implemented for videoWidget!')
        else:
            if not isinstance(widgetOptions, dict):
                widgetOptions = {}
            elif not 'styleSheet' in widgetOptions:
                # just a default background for testing purposes
                widgetOptions = {'styleSheet': 'background: darkGray;'}
            videoWidget = VideoWidget(**widgetOptions)
        self.videoWidget = videoWidget

        # QVideoFrame.image() has been introduced since Qt 5.15
        version, majVersion, minVersion = map(int, QT_VERSION_STR.split('.'))
        if version < 6 and majVersion < 15:
            self.imageFromFrame = self._imageFromFrameFix
        else:
            self.imageFromFrame = lambda frame: frame.image()

    def _imageFromFrameFix(self, frame):
        clone_frame = QVideoFrame(frame)
        clone_frame.map(QAbstractVideoBuffer.ReadOnly)
        image = QImage(
            clone_frame.bits(), frame.width(), frame.height(), frame.bytesPerLine(), 
            QVideoFrame.imageFormatFromPixelFormat(frame.pixelFormat()))
        clone_frame.unmap()
        return image

    def supportedPixelFormats(self, type):
        return [QVideoFrame.Format_ARGB32]

    def present(self, frame: QVideoFrame):
        if frame.isValid():
            self.videoWidget.setImage(self.imageFromFrame(frame))

        if self.surfaceFormat().pixelFormat() != frame.pixelFormat() or \
            self.surfaceFormat().frameSize() != frame.size():
                self.setError(QAbstractVideoSurface.IncorrectFormatError)
                self.stop()
                return False
        else:
            return True


class AlphaVideoTest(QMainWindow):
    def __init__(self):
        super().__init__()
        self.setStyleSheet('''
            QFrame#mainFrame {
                background: green;
            }
        ''')

        mainFrame = QFrame(objectName='mainFrame')
        self.setCentralWidget(mainFrame)

        layout = QVBoxLayout(mainFrame)
        self.playButton = QPushButton('Play', checkable=True)
        layout.addWidget(self.playButton)

        self.drawer = AlphaVideoDrawer()
        layout.addWidget(self.drawer.videoWidget)

        self.mediaPlayer1 = QMediaPlayer(self, QMediaPlayer.VideoSurface)
        self.playlist = QMediaPlaylist(self)
        path = QDir.current().absoluteFilePath('vida1.mov')
        self.playlist.addMedia(QMediaContent(QUrl.fromLocalFile(path)))
        self.playlist.setCurrentIndex(1)
        self.playlist.setPlaybackMode(QMediaPlaylist.CurrentItemInLoop)

        self.mediaPlayer1.setPlaylist(self.playlist)
        self.mediaPlayer1.setVideoOutput(self.drawer)

        self.playButton.toggled.connect(self.togglePlay)

    def togglePlay(self, play):
        if play:
            self.mediaPlayer1.play()
            self.playButton.setText('Pause')
        else:
            self.mediaPlayer1.pause()
            self.playButton.setText('Play')

import sys
app = QApplication(sys.argv)
test = AlphaVideoTest()
test.show()
sys.exit(app.exec_())

我基于以下来源的上述代码：

请注意，我限制了 supportedPixelFormats 输出，因为使用相关问题中提供的完整格式列表不起作用；这并不意味着这无论如何都会起作用，但可能需要进一步测试，可能在不同的机器和不同的操作系统/系统配置和视频格式上：请记住，QMediaPlayer 完全依赖于底层操作系统和默认媒体后端。

最后，如果您只需要“有限”和预定义的动画，请考虑实现您自己的 QWidget 子类，它使用加载的 PNG 图像列表并通过实现 paintEvent() 来显示它们，该 paintEvent() 将基于更新调用QVariantAnimation。虽然这种实现可能会导致性能下降或不太理想，但它的主要优势在于提供跨平台兼容性。

【讨论】：

哇。非常感谢您的代码和反馈。我已经在 mac 上尝试过代码，视频运行但没有 alpha。还是黑色的。我尝试添加、切换supportedPixelFormats 输出但没有效果。这是一块坚韧的骨头。
@noi 不幸的是，mac 在这些方面通常有点挑剔。你在 shell 中有任何输出吗？
我真的很喜欢 QVariantAnimation 方法。我不需要便携性，所以这不是问题。我喜欢我不需要逐帧处理 alpha 的事实。我发现了这个：stackoverflow.com/questions/56247882/… 听起来是个好方法。问题是要完成24fps。我不知道是否有可能实现每 42 毫秒改变一次 png（x4，如果有 4 个动画正在运行）。你怎么看？
@noi 具有智能实现，理论上可以实现，但这取决于很多方面：使用具有 integer 值的 QVariantAnimation（值是帧index），您可以确保无论如何更新动画和时间同步（因为它是基于持续时间的），唯一的问题是图像更新不会“跟上”，会有一些丢帧取决于关于电脑能力。而且，显然，内存使用可能存在一些问题，因为除非使用正确的实现，否则它可能会将所有帧加载到 RAM 中。