Develop Reference

How to put a Scrollarea with other Widgets in the Layout?

I want to have other zones for different kind of menus and a scroll area for scrolling a 2D space, like an big image. The problem is once I use a scroll area It takes over everything. All the other widgets disappears.
Here's a demo code:
import sys
from PyQt5.QtWidgets import (QApplication, QMainWindow, QWidget,
QVBoxLayout, QFrame, QScrollArea, QHBoxLayout)
app = QApplication(sys.argv)
layout = QVBoxLayout()
b_widget=QWidget()
b_widget.setStyleSheet("background-color: blue")
r_widget=QWidget()
r_widget.setStyleSheet("background-color: red")
g_widget=QWidget()
g_widget.setStyleSheet("background-color: green")
scroll=QScrollArea()
scroll.setWidget(g_widget)
layout.addWidget(scroll)
layout.addWidget(r_widget)
layout.addWidget(b_widget)
widget = QWidget()
widget.setLayout(layout)
main=QMainWindow()
main.setCentralWidget(widget)
main.show()
app.exec()
Thank you for your help!

Designer widget shadow?

I have added a widget in my mainwindows and I would like to give it a show something like box-shadow: 3px 3px 25px #111;
I tried above by going to widget change stylesheet option and adding the code as below:
background-color:#fff;
border:4px solid blue;
box-shadow: 0px -3px 5px #a6a6a6;
The first two attribute give the expected effect but box-shadow don't work.
How to use Python QT Designer and add box shadow to a widget?

Qt StyleSheet is not CSS but it is a technology that implements some features, and among them is not the box-shadow. If you want to implement something similar then you should use QGraphicsDropShadowEffect:
import sys
from PyQt5.QtCore import QPoint, Qt
from PyQt5.QtGui import QColor
from PyQt5.QtWidgets import (
QApplication,
QGraphicsDropShadowEffect,
QMainWindow,
QVBoxLayout,
QWidget,
)
def main():
app = QApplication(sys.argv)
main_window = QMainWindow()
container = QWidget()
container.setContentsMargins(3, 3, 3, 3)
main_window.setCentralWidget(container)
widget = QWidget()
widget.setAutoFillBackground(True)
lay = QVBoxLayout(container)
lay.addWidget(widget)
effect = QGraphicsDropShadowEffect(
offset=QPoint(3, 3), blurRadius=25, color=QColor("#111")
)
widget.setGraphicsEffect(effect)
main_window.resize(640, 480)
main_window.show()
sys.exit(app.exec_())
if __name__ == "__main__":
main()
It is recommended that you read the Qt Stylesheet references:
https://doc.qt.io/qt-5/stylesheet-reference.html
https://doc.qt.io/qt-5/stylesheet-syntax.html

PyQt embed QWebEngineView in Main Window

I'm coming from a tkinter background where everything can be put in a frame.
How can I get my current working codes result (which launches a WebEngine View of a page, google in this instance) to sit inside a main window like shown in the image? Going by the image I want the WebEngine to be housed in the "Green" Box for example.
Working code including all versions used
"""
Python version - 3.7.3
PyQt5 5.15.3
PyQt5-Qt 5.15.2
PyQt5-sip 12.8.1
PyQtWebEngine 5.15.3
PyQtWebEngine-Qt 5.15.2
"""
import sys
from PyQt5.QtWebEngineWidgets import QWebEnginePage
from PyQt5.QtWidgets import QApplication
from PyQt5.QtCore import QUrl
from PyQt5.QtWebEngineWidgets import QWebEngineView
url = 'https://google.com'
app = QApplication(sys.argv)
# QWebEngineView
browser = QWebEngineView()
browser.load(QUrl(url))
browser.show()
sys.exit(app.exec_())

You have to use a QGridLayout:
import sys
from PyQt5.QtWidgets import QApplication, QGridLayout, QMainWindow, QTextEdit, QWidget
from PyQt5.QtCore import QUrl
from PyQt5.QtWebEngineWidgets import QWebEngineView
url = "https://google.com"
app = QApplication(sys.argv)
w = QMainWindow()
browser = QWebEngineView()
browser.load(QUrl(url))
central_widget = QWidget()
w.setCentralWidget(central_widget)
lay = QGridLayout(central_widget)
lay.addWidget(browser, 0, 0, 2, 1)
lay.addWidget(QTextEdit(), 0, 1)
lay.addWidget(QTextEdit(), 1, 1)
lay.setColumnStretch(0, 1)
lay.setColumnStretch(1, 1)
lay.setRowStretch(0, 1)
lay.setRowStretch(1, 1)
w.show()
sys.exit(app.exec_())

You could use a vertical layout to hold the two red boxes. And then use a horizontal layout to hold the QWebEngineView and the vertical layout. Zetcode has a good tutorial for layouts. Code heavily borrowed from #eyllanesc:
import sys
from PyQt5.QtWidgets import (QApplication, QMainWindow,
QHBoxLayout, QVBoxLayout,
QTextEdit, QWidget)
from PyQt5.QtCore import QUrl
from PyQt5.QtWebEngineWidgets import QWebEngineView
url = "https://google.com"
app = QApplication(sys.argv)
w = QMainWindow()
browser = QWebEngineView()
browser.load(QUrl(url))
central_widget = QWidget()
w.setCentralWidget(central_widget)
vertical = QVBoxLayout()
vertical.addWidget(QTextEdit())
vertical.addWidget(QTextEdit())
horizontal = QHBoxLayout(central_widget)
horizontal.addWidget(browser)
horizontal.addLayout(vertical)
w.show()
sys.exit(app.exec_())

make a layout widget to be floating ouside of mainwindow pyqt5

everyone.
I want to float a widget inside a layout of a main-window.
the widget is disappered from layout but not displayed on screen
As you can see from following code. I floated two labels 'lbl_title' and 'lbl_icon'
they seems to be floated but not displayed on screen.
Here comes my code.
If you loose commented line, then the lbl_icon and title is removed from layout but not are shown on my screen
from PyQt5.QtCore import QDir, Qt, QUrl
from PyQt5.QtMultimedia import QMediaContent, QMediaPlayer
from PyQt5.QtMultimediaWidgets import QVideoWidget
from PyQt5.QtWidgets import (QApplication, QFileDialog, QHBoxLayout, QLabel,
QPushButton, QSizePolicy, QSlider, QStyle, QVBoxLayout, QWidget)
from PyQt5.QtWidgets import QMainWindow,QWidget, QPushButton, QAction,QGridLayout
from PyQt5.QtGui import QIcon,QPixmap
import sys
from PyQt5.QtCore import *
class CommonLessonItem(QWidget):
def __init__(self,parent):
super(CommonLessonItem,self).__init__(parent)
self.lbl_title = QLabel(self)
self.lbl_description = QLabel(self)
self.lbl_icon = QLabel(self)
self.__initUI()
self.isChild = False
def __initUI(self):
#set layout
self.layout = QGridLayout(self)
self.layout.addWidget(self.lbl_title,0,0,1,19)
self.layout.addWidget(self.lbl_icon,0,19,1,1)
self.layout.addWidget(self.lbl_description,1,0,1,20)
self.lbl_icon.setWindowFlags(Qt.FramelessWindowHint|Qt.Window)
self.lbl_icon.move(100,100)
self.lbl_title.setWindowFlags(Qt.FramelessWindowHint|Qt.Window)
self.lbl_title.move(100,100)
#initialize info
self.setInfo("Title","Description",None)
self.setLayout(self.layout)
def setInfo(self,title,description,iconPath):
self.lbl_title.setText(title)
self.lbl_description.setText(description)
if(iconPath is not None):
self.lbl_icon.setPixmap(QPixmap(iconPath))
def moveEvent(self,event):
super().moveEvent(event)
if __name__ == "__main__":
app = QApplication(sys.argv)
mw = CommonLessonItem(None)
# mw.setSize(10,200)
mw.show()
sys.exit(app.exec_())
I need your help.

Whenever a widget becomes a top level window by setting the parent to None or, like in your case, setting the Window flag (but I wouldn't suggest that approach) show() must be called.
As explained in windowFlags:
Note: This function calls setParent() when changing the flags for a window, causing the widget to be hidden. You must call show() to make the widget visible again..
Add self.lbl_icon.show() and self.lbl_title.show() after changing their window state.

(Py)Qt: Spacing in QHBoxLayout shows centralwidget's background, not parent's

Consider the following example code:
from PyQt5.QtWidgets import (QApplication, QHBoxLayout, QLabel, QWidget,
QMainWindow, QVBoxLayout, QTextEdit)
class MainWindow(QMainWindow):
def __init__(self):
super().__init__()
cwidget = QWidget(self)
cwidget.setStyleSheet("QWidget { background-color: red; }")
self.setCentralWidget(cwidget)
self.resize(100, 100)
vbox = QVBoxLayout(cwidget)
vbox.addWidget(QTextEdit(self))
vbox.addWidget(BlackBar(self))
class BlackBar(QWidget):
def __init__(self, parent=None):
super().__init__(parent)
self.setStyleSheet("* { background-color: black; color: white; }")
hbox = QHBoxLayout(self)
hbox.setSpacing(5)
hbox.addWidget(QLabel(text="eggs"))
hbox.addWidget(QLabel(text="bacon"))
if __name__ == '__main__':
app = QApplication([])
main = MainWindow()
main.show()
app.exec_()
It has:
A QMainWindow, QWidget as central widget (red), QVBoxLayout as a child of the cental widget. Inside there:
A QTextEdit (just as a filler)
A QWidget (black), which contains a QHBoxLayout. Inside that:
Two QLabels
This looks like this:
I'd expect the spaces between the labels to be black, because the QHBoxLayout is a child of BlackBar, but it seems BlackBar is just "invisible" in between and the central widget "shines through". Why is this?

The bugreport has now been answered with a solution that's easier than #ekhumoro's answer and works:
I don't think this is valid. The paint code your are looking for is not drawn in the paintEvent. Look for QWidgetPrivate::paintBackground instead. For performance reasons widgets will ignore style sheets by default, but you can set the WA_StyledBackground attribute on the widget and it should respect style sheet backgrounds.
And indeed, doing this before setting the stylesheet does the trick:
self.setAttribute(Qt.WA_StyledBackground)

Although the Style Sheet Syntax does not mention it, it seems that the QWidget class is treated differently when it comes to stylesheets.
Other widgets will work fine with your example code. For example, if QWidget is replaced everywhere with QFrame, then everything works as expected.
To get stylesheet support for QWidget subclasses, you need to reimplement the paintEvent and enable it explicitly:
class BlackBar(QWidget):
...
def paintEvent(self, event):
option = QStyleOption()
option.initFrom(self)
painter = QPainter(self)
self.style().drawPrimitive(
QStyle.PE_Widget, option, painter, self)