I am making a videoplayer with QMediaplayer and QVideoWidget using PySide2. Everything works as expected but when I use:
self.setWindowFlags(QtCore.Qt.FramelessWindowHint)
self.setAttribute(QtCore.Qt.WA_TranslucentBackground)
The sound is reporoduced but the video is not displayed. Is there a possibility to use the FramelessWindowHint and WA_TranslucentBackground with QVideoWidget?
NOTE: I am using QStackedWidget and QFrames
Here is minimal and reproducible example:
testMP.py
import sys
from PySide2.QtCore import Qt, QUrl
from PySide2.QtMultimedia import QMediaContent, QMediaPlayer
from PySide2.QtMultimediaWidgets import QVideoWidget
from PySide2.QtWidgets import (QApplication, QFileDialog, QVBoxLayout,QMainWindow)
from testMP_GUI import Ui_MainWindow
class MainWindow(QMainWindow, Ui_MainWindow):
def __init__(self):
super(MainWindow, self).__init__()
self.setupUi(self)
self.setWindowFlags(Qt.FramelessWindowHint) # <-------------------
self.setAttribute(Qt.WA_TranslucentBackground) # <-------------------
self.mediaPlayer = QMediaPlayer(None, QMediaPlayer.VideoSurface)
self.videoWidget = QVideoWidget()
self.mediaPlayer.setVideoOutput(self.videoWidget)
layout = QVBoxLayout()
layout.addWidget(self.videoWidget)
self.video_viewer.setLayout(layout)
openButton = self.btn_open
openButton.clicked.connect(self.open_song)
self.playButton = self.btn_play
self.playButton.clicked.connect(self.play)
def open_song(self):
fileName, _ = QFileDialog.getOpenFileName(self, "Select files",
".", "Video Files (*.mp4 *.flv *.ts *.mts *.avi)")
if fileName != '':
self.mediaPlayer.setMedia(
QMediaContent(QUrl.fromLocalFile(fileName)))
self.playButton.setEnabled(True)
self.play()
def play(self):
if self.mediaPlayer.state() == QMediaPlayer.PlayingState:
self.mediaPlayer.pause()
else:
self.mediaPlayer.play()
if __name__ == '__main__':
app = QApplication(sys.argv)
window = MainWindow()
window.show()
app.exec_()
testMP_GUI.py
# -*- coding: utf-8 -*-
################################################################################
## Form generated from reading UI file 'testMP_GUI.ui'
##
## Created by: Qt User Interface Compiler version 5.15.2
##
## WARNING! All changes made in this file will be lost when recompiling UI file!
################################################################################
from PySide2.QtCore import *
from PySide2.QtGui import *
from PySide2.QtWidgets import *
import files_rc
class Ui_MainWindow(object):
def setupUi(self, MainWindow):
if not MainWindow.objectName():
MainWindow.setObjectName(u"MainWindow")
MainWindow.resize(1000, 720)
MainWindow.setMinimumSize(QSize(1000, 720))
palette = QPalette()
brush = QBrush(QColor(255, 255, 255, 255))
brush.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.WindowText, brush)
brush1 = QBrush(QColor(0, 0, 0, 0))
brush1.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Button, brush1)
brush2 = QBrush(QColor(66, 73, 90, 255))
brush2.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Light, brush2)
brush3 = QBrush(QColor(55, 61, 75, 255))
brush3.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Midlight, brush3)
brush4 = QBrush(QColor(22, 24, 30, 255))
brush4.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Dark, brush4)
brush5 = QBrush(QColor(29, 32, 40, 255))
brush5.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Mid, brush5)
brush6 = QBrush(QColor(210, 210, 210, 255))
brush6.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Text, brush6)
palette.setBrush(QPalette.Active, QPalette.BrightText, brush)
palette.setBrush(QPalette.Active, QPalette.ButtonText, brush)
palette.setBrush(QPalette.Active, QPalette.Base, brush1)
palette.setBrush(QPalette.Active, QPalette.Window, brush1)
brush7 = QBrush(QColor(0, 0, 0, 255))
brush7.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Shadow, brush7)
brush8 = QBrush(QColor(85, 170, 255, 255))
brush8.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.Highlight, brush8)
palette.setBrush(QPalette.Active, QPalette.Link, brush8)
brush9 = QBrush(QColor(255, 0, 127, 255))
brush9.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.LinkVisited, brush9)
palette.setBrush(QPalette.Active, QPalette.AlternateBase, brush4)
brush10 = QBrush(QColor(44, 49, 60, 255))
brush10.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Active, QPalette.ToolTipBase, brush10)
palette.setBrush(QPalette.Active, QPalette.ToolTipText, brush6)
palette.setBrush(QPalette.Inactive, QPalette.WindowText, brush)
palette.setBrush(QPalette.Inactive, QPalette.Button, brush1)
palette.setBrush(QPalette.Inactive, QPalette.Light, brush2)
palette.setBrush(QPalette.Inactive, QPalette.Midlight, brush3)
palette.setBrush(QPalette.Inactive, QPalette.Dark, brush4)
palette.setBrush(QPalette.Inactive, QPalette.Mid, brush5)
palette.setBrush(QPalette.Inactive, QPalette.Text, brush6)
palette.setBrush(QPalette.Inactive, QPalette.BrightText, brush)
palette.setBrush(QPalette.Inactive, QPalette.ButtonText, brush)
palette.setBrush(QPalette.Inactive, QPalette.Base, brush1)
palette.setBrush(QPalette.Inactive, QPalette.Window, brush1)
palette.setBrush(QPalette.Inactive, QPalette.Shadow, brush7)
palette.setBrush(QPalette.Inactive, QPalette.Highlight, brush8)
palette.setBrush(QPalette.Inactive, QPalette.Link, brush8)
palette.setBrush(QPalette.Inactive, QPalette.LinkVisited, brush9)
palette.setBrush(QPalette.Inactive, QPalette.AlternateBase, brush4)
palette.setBrush(QPalette.Inactive, QPalette.ToolTipBase, brush10)
palette.setBrush(QPalette.Inactive, QPalette.ToolTipText, brush6)
palette.setBrush(QPalette.Disabled, QPalette.WindowText, brush4)
palette.setBrush(QPalette.Disabled, QPalette.Button, brush1)
palette.setBrush(QPalette.Disabled, QPalette.Light, brush2)
palette.setBrush(QPalette.Disabled, QPalette.Midlight, brush3)
palette.setBrush(QPalette.Disabled, QPalette.Dark, brush4)
palette.setBrush(QPalette.Disabled, QPalette.Mid, brush5)
palette.setBrush(QPalette.Disabled, QPalette.Text, brush4)
palette.setBrush(QPalette.Disabled, QPalette.BrightText, brush)
palette.setBrush(QPalette.Disabled, QPalette.ButtonText, brush4)
palette.setBrush(QPalette.Disabled, QPalette.Base, brush1)
palette.setBrush(QPalette.Disabled, QPalette.Window, brush1)
palette.setBrush(QPalette.Disabled, QPalette.Shadow, brush7)
brush11 = QBrush(QColor(51, 153, 255, 255))
brush11.setStyle(Qt.SolidPattern)
palette.setBrush(QPalette.Disabled, QPalette.Highlight, brush11)
palette.setBrush(QPalette.Disabled, QPalette.Link, brush8)
palette.setBrush(QPalette.Disabled, QPalette.LinkVisited, brush9)
palette.setBrush(QPalette.Disabled, QPalette.AlternateBase, brush10)
palette.setBrush(QPalette.Disabled, QPalette.ToolTipBase, brush10)
palette.setBrush(QPalette.Disabled, QPalette.ToolTipText, brush6)
MainWindow.setPalette(palette)
font = QFont()
font.setFamily(u"Segoe UI")
font.setPointSize(10)
MainWindow.setFont(font)
MainWindow.setStyleSheet(u"QMainWindow {background: transparent; }\n"
"QToolTip {\n"
" color: #ffffff;\n"
" background-color: rgba(27, 29, 35, 160);\n"
" border: 1px solid rgb(40, 40, 40);\n"
" border-radius: 2px;\n"
"}")
self.centralwidget = QWidget(MainWindow)
self.centralwidget.setObjectName(u"centralwidget")
self.centralwidget.setStyleSheet(u"background: transparent;\n"
"color: rgb(210, 210, 210);")
self.horizontalLayout = QHBoxLayout(self.centralwidget)
self.horizontalLayout.setSpacing(0)
self.horizontalLayout.setObjectName(u"horizontalLayout")
self.horizontalLayout.setContentsMargins(10, 10, 10, 10)
self.frame_main = QFrame(self.centralwidget)
self.frame_main.setObjectName(u"frame_main")
self.frame_main.setStyleSheet(u"/* LINE EDIT */\n"
"QLineEdit {\n"
" background-color: rgb(27, 29, 35);\n"
" border-radius: 5px;\n"
" border: 2px solid rgb(27, 29, 35);\n"
" padding-left: 10px;\n"
"}\n"
"QLineEdit:hover {\n"
" border: 2px solid rgb(64, 71, 88);\n"
"}\n"
"QLineEdit:focus {\n"
" border: 2px solid rgb(91, 101, 124);\n"
"}\n"
"\n"
"/* SCROLL BARS */\n"
"QScrollBar:horizontal {\n"
" border: none;\n"
" background: rgb(52, 59, 72);\n"
" height: 14px;\n"
" margin: 0px 21px 0 21px;\n"
" border-radius: 0px;\n"
"}\n"
"QScrollBar::handle:horizontal {\n"
" background: rgb(85, 170, 255);\n"
" min-width: 25px;\n"
" border-radius: 7px\n"
"}\n"
"QScrollBar::add-line:horizontal {\n"
" border: none;\n"
" background: rgb(55, 63, 77);\n"
" width: 20px;\n"
" border-top-right-radius: 7px;\n"
" border-bottom-right-radius: 7px;\n"
" subcontrol-position: right;\n"
" subcontrol-origin: margin;\n"
"}\n"
"QScrollBar::sub-line:horizontal {\n"
" border: none;\n"
" background: rgb(55, 63, 77);\n"
" width: 20px;\n"
""
" border-top-left-radius: 7px;\n"
" border-bottom-left-radius: 7px;\n"
" subcontrol-position: left;\n"
" subcontrol-origin: margin;\n"
"}\n"
"QScrollBar::up-arrow:horizontal, QScrollBar::down-arrow:horizontal\n"
"{\n"
" background: none;\n"
"}\n"
"QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal\n"
"{\n"
" background: none;\n"
"}\n"
" QScrollBar:vertical {\n"
" border: none;\n"
" background: rgb(52, 59, 72);\n"
" width: 14px;\n"
" margin: 21px 0 21px 0;\n"
" border-radius: 0px;\n"
" }\n"
" QScrollBar::handle:vertical { \n"
" background: rgb(85, 170, 255);\n"
" min-height: 25px;\n"
" border-radius: 7px\n"
" }\n"
" QScrollBar::add-line:vertical {\n"
" border: none;\n"
" background: rgb(55, 63, 77);\n"
" height: 20px;\n"
" border-bottom-left-radius: 7px;\n"
" border-bottom-right-radius: 7px;\n"
" subcontrol-position: bottom;\n"
" subcontrol-origin: margin;\n"
" }\n"
" QScrollBar::sub-line:vertical {\n"
" border: none;\n"
" background: rgb(55, 63"
", 77);\n"
" height: 20px;\n"
" border-top-left-radius: 7px;\n"
" border-top-right-radius: 7px;\n"
" subcontrol-position: top;\n"
" subcontrol-origin: margin;\n"
" }\n"
" QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical {\n"
" background: none;\n"
" }\n"
"\n"
" QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {\n"
" background: none;\n"
" }\n"
"\n"
"/* CHECKBOX */\n"
"QCheckBox::indicator {\n"
" border: 3px solid rgb(52, 59, 72);\n"
" width: 15px;\n"
" height: 15px;\n"
" border-radius: 10px;\n"
" background: rgb(44, 49, 60);\n"
"}\n"
"QCheckBox::indicator:hover {\n"
" border: 3px solid rgb(58, 66, 81);\n"
"}\n"
"QCheckBox::indicator:checked {\n"
" background: 3px solid rgb(52, 59, 72);\n"
" border: 3px solid rgb(52, 59, 72); \n"
" background-image: url(:/16x16/icons/16x16/cil-check-alt.png);\n"
"}\n"
"\n"
"/* RADIO BUTTON */\n"
"QRadioButton::indicator {\n"
" border: 3px solid rgb(52, 59, 72);\n"
" width: 15px;\n"
" height: 15px;\n"
" border-radius"
": 10px;\n"
" background: rgb(44, 49, 60);\n"
"}\n"
"QRadioButton::indicator:hover {\n"
" border: 3px solid rgb(58, 66, 81);\n"
"}\n"
"QRadioButton::indicator:checked {\n"
" background: 3px solid rgb(94, 106, 130);\n"
" border: 3px solid rgb(52, 59, 72); \n"
"}\n"
"\n"
"/* COMBOBOX */\n"
"QComboBox{\n"
" background-color: rgb(27, 29, 35);\n"
" border-radius: 5px;\n"
" border: 2px solid rgb(27, 29, 35);\n"
" padding: 5px;\n"
" padding-left: 10px;\n"
"}\n"
"QComboBox:hover{\n"
" border: 2px solid rgb(64, 71, 88);\n"
"}\n"
"QComboBox::drop-down {\n"
" subcontrol-origin: padding;\n"
" subcontrol-position: top right;\n"
" width: 25px; \n"
" border-left-width: 3px;\n"
" border-left-color: rgba(39, 44, 54, 150);\n"
" border-left-style: solid;\n"
" border-top-right-radius: 3px;\n"
" border-bottom-right-radius: 3px; \n"
" background-image: url(:/16x16/icons/16x16/cil-arrow-bottom.png);\n"
" background-position: center;\n"
" background-repeat: no-reperat;\n"
" }\n"
"QComboBox QAbstractItemView {\n"
" color: rgb("
"85, 170, 255); \n"
" background-color: rgb(27, 29, 35);\n"
" padding: 10px;\n"
" selection-background-color: rgb(39, 44, 54);\n"
"}\n"
"\n"
"/* SLIDERS */\n"
"QSlider::groove:horizontal {\n"
" border-radius: 9px;\n"
" height: 18px;\n"
" margin: 0px;\n"
" background-color: rgb(52, 59, 72);\n"
"}\n"
"QSlider::groove:horizontal:hover {\n"
" background-color: rgb(55, 62, 76);\n"
"}\n"
"QSlider::handle:horizontal {\n"
" background-color: rgb(85, 170, 255);\n"
" border: none;\n"
" height: 18px;\n"
" width: 18px;\n"
" margin: 0px;\n"
" border-radius: 9px;\n"
"}\n"
"QSlider::handle:horizontal:hover {\n"
" background-color: rgb(105, 180, 255);\n"
"}\n"
"QSlider::handle:horizontal:pressed {\n"
" background-color: rgb(65, 130, 195);\n"
"}\n"
"\n"
"QSlider::groove:vertical {\n"
" border-radius: 9px;\n"
" width: 18px;\n"
" margin: 0px;\n"
" background-color: rgb(52, 59, 72);\n"
"}\n"
"QSlider::groove:vertical:hover {\n"
" background-color: rgb(55, 62, 76);\n"
"}\n"
"QSlider::handle:verti"
"cal {\n"
" background-color: rgb(85, 170, 255);\n"
" border: none;\n"
" height: 18px;\n"
" width: 18px;\n"
" margin: 0px;\n"
" border-radius: 9px;\n"
"}\n"
"QSlider::handle:vertical:hover {\n"
" background-color: rgb(105, 180, 255);\n"
"}\n"
"QSlider::handle:vertical:pressed {\n"
" background-color: rgb(65, 130, 195);\n"
"}\n"
"\n"
"")
self.frame_main.setFrameShape(QFrame.NoFrame)
self.frame_main.setFrameShadow(QFrame.Raised)
self.verticalLayout = QVBoxLayout(self.frame_main)
self.verticalLayout.setSpacing(0)
self.verticalLayout.setObjectName(u"verticalLayout")
self.verticalLayout.setContentsMargins(0, 0, 0, 0)
self.frame_center = QFrame(self.frame_main)
self.frame_center.setObjectName(u"frame_center")
sizePolicy = QSizePolicy(QSizePolicy.Expanding, QSizePolicy.Expanding)
sizePolicy.setHorizontalStretch(0)
sizePolicy.setVerticalStretch(0)
sizePolicy.setHeightForWidth(self.frame_center.sizePolicy().hasHeightForWidth())
self.frame_center.setSizePolicy(sizePolicy)
self.frame_center.setStyleSheet(u"background-color: rgb(40, 44, 52);")
self.frame_center.setFrameShape(QFrame.NoFrame)
self.frame_center.setFrameShadow(QFrame.Raised)
self.horizontalLayout_2 = QHBoxLayout(self.frame_center)
self.horizontalLayout_2.setSpacing(0)
self.horizontalLayout_2.setObjectName(u"horizontalLayout_2")
self.horizontalLayout_2.setContentsMargins(0, 0, 0, 0)
self.frame_content_right = QFrame(self.frame_center)
self.frame_content_right.setObjectName(u"frame_content_right")
self.frame_content_right.setStyleSheet(u"background-color: rgb(44, 49, 60);")
self.frame_content_right.setFrameShape(QFrame.NoFrame)
self.frame_content_right.setFrameShadow(QFrame.Raised)
self.verticalLayout_4 = QVBoxLayout(self.frame_content_right)
self.verticalLayout_4.setSpacing(0)
self.verticalLayout_4.setObjectName(u"verticalLayout_4")
self.verticalLayout_4.setContentsMargins(0, 0, 0, 0)
self.frame_content = QFrame(self.frame_content_right)
self.frame_content.setObjectName(u"frame_content")
self.frame_content.setMaximumSize(QSize(16777215, 16777215))
self.frame_content.setFrameShape(QFrame.NoFrame)
self.frame_content.setFrameShadow(QFrame.Raised)
self.verticalLayout_9 = QVBoxLayout(self.frame_content)
self.verticalLayout_9.setSpacing(0)
self.verticalLayout_9.setObjectName(u"verticalLayout_9")
self.verticalLayout_9.setContentsMargins(5, 5, 5, 5)
self.stackedWidget = QStackedWidget(self.frame_content)
self.stackedWidget.setObjectName(u"stackedWidget")
self.stackedWidget.setStyleSheet(u"/*background: transparent;*/")
self.stackedWidget.setLineWidth(-1)
self.page_1 = QWidget()
self.page_1.setObjectName(u"page_1")
self.page_1.setAutoFillBackground(False)
self.verticalLayout_12 = QVBoxLayout(self.page_1)
self.verticalLayout_12.setObjectName(u"verticalLayout_12")
self.btn_play = QPushButton(self.page_1)
self.btn_play.setObjectName(u"btn_play")
self.verticalLayout_12.addWidget(self.btn_play)
self.btn_open = QPushButton(self.page_1)
self.btn_open.setObjectName(u"btn_open")
self.verticalLayout_12.addWidget(self.btn_open)
self.video_viewer = QWidget(self.page_1)
self.video_viewer.setObjectName(u"video_viewer")
self.verticalLayout_12.addWidget(self.video_viewer)
self.stackedWidget.addWidget(self.page_1)
self.page_2 = QWidget()
self.page_2.setObjectName(u"page_2")
self.verticalLayout_10 = QVBoxLayout(self.page_2)
self.verticalLayout_10.setObjectName(u"verticalLayout_10")
self.stackedWidget.addWidget(self.page_2)
self.page_3 = QWidget()
self.page_3.setObjectName(u"page_3")
self.verticalLayout_13 = QVBoxLayout(self.page_3)
self.verticalLayout_13.setObjectName(u"verticalLayout_13")
self.stackedWidget.addWidget(self.page_3)
self.page_4 = QWidget()
self.page_4.setObjectName(u"page_4")
self.verticalLayout_6 = QVBoxLayout(self.page_4)
self.verticalLayout_6.setObjectName(u"verticalLayout_6")
self.stackedWidget.addWidget(self.page_4)
self.verticalLayout_9.addWidget(self.stackedWidget)
self.verticalLayout_4.addWidget(self.frame_content)
self.horizontalLayout_2.addWidget(self.frame_content_right)
self.verticalLayout.addWidget(self.frame_center)
self.horizontalLayout.addWidget(self.frame_main)
MainWindow.setCentralWidget(self.centralwidget)
self.retranslateUi(MainWindow)
self.stackedWidget.setCurrentIndex(0)
QMetaObject.connectSlotsByName(MainWindow)
# setupUi
def retranslateUi(self, MainWindow):
MainWindow.setWindowTitle(QCoreApplication.translate("MainWindow", u"MainWindow", None))
self.btn_play.setText(QCoreApplication.translate("MainWindow", u"Play", None))
self.btn_open.setText(QCoreApplication.translate("MainWindow", u"Open", None))
# retranslateUi
My problem is that with WA_TranslucentBackground active, the QVideoWidget does not show up at all.
If anyone else has the same problems, here is the solution I used. I achieved a solution using the:
QGraphicsVideoItem()
QGraphicsScene()
QGraphicsView()
self.player = QMediaPlayer(None, QMediaPlayer.VideoSurface)
self.videoItem = QGraphicsVideoItem()
scene = QGraphicsScene(self)
graphicsView = QGraphicsView(scene)
scene.addItem(self.videoItem)
layout = QVBoxLayout()
layout.addWidget(graphicsView)
self.ui.video_viewer.setLayout(layout)
self.player.setVideoOutput(self.videoItem)