I'm trying to make an application in python, with the visible window a pyglet one. The problem is, I need graphics capability AND interactions with HTML pages at the same time. I'm going to use a PyQt6 to communicate with the HTML. So the question is, how do I get a PyQT6 window to render INSIDE a Pyglet window?
My current code:
import pyglet
from pyglet.gl import *
import sys
from PyQt6.QtWidgets import QApplication, QWidget
app = QApplication(sys.argv)
w = QWidget()
w.resize(250, 200)
w.move(300, 300)
w.setWindowTitle('Simple')
w.show()
window = pyglet.window.Window(800, 600, "Radium")
#window.event
def on_draw():
window.clear()
# Render window with OpenGL
# ...
pyglet.app.run()
sys.exit(app.exec())
I am not sure if you can render PyQT inside a Pyglet Window. It has it's own rendering and drawing system that can't be accessed at a low level required to integrate it into a pyglet Window.
You can however do the reverse, OpenGL (and by extension, use pyglet) in QT. However this also means you need to be experienced in both to really make it work well.
I have made a runnable example using PyQt6:
import sys
import pyglet
#from PyQt5 import QtGui
#from PyQt5 import QtCore, QtWidgets
#from PyQt5.QtOpenGL import QGLWidget as OpenGLWidget
from PyQt6 import QtGui
from PyQt6 import QtCore, QtWidgets
from PyQt6.QtOpenGLWidgets import QOpenGLWidget as OpenGLWidget
from pyglet.gl import glClear, GL_COLOR_BUFFER_BIT, GL_DEPTH_BUFFER_BIT
import random
"""An example showing how to use pyglet in QT, utilizing the OGLWidget.
Since this relies on the QT Window, any events called on Pyglet Window
will NOT be called.
This includes mouse, keyboard, tablet, and anything else relating to the Window
itself. These must be handled by QT itself.
This just allows user to create and use pyglet related things such as sprites, shapes,
batches, clock scheduling, sound, etc.
"""
class MainWidget(QtWidgets.QWidget):
def __init__(self, parent=None):
super().__init__()
self.setWindowTitle("Pyglet and QT Example")
self.shapes = []
width, height = 640, 480
self.opengl = PygletWidget(width, height)
self.sprite_button = QtWidgets.QPushButton('Create Rectangle', self)
self.sprite_button.clicked.connect(self.create_sprite_click)
self.clear_sprite_button = QtWidgets.QPushButton('Clear Shapes', self)
self.clear_sprite_button.clicked.connect(self.clear_sprite_click)
mainLayout = QtWidgets.QVBoxLayout()
mainLayout.addWidget(self.opengl)
mainLayout.addWidget(self.sprite_button)
mainLayout.addWidget(self.clear_sprite_button)
self.setLayout(mainLayout)
def create_sprite_click(self):
gl_width, gl_height = self.opengl.size().width(), self.opengl.size().height()
width = random.randint(50, 100)
height = random.randint(50, 100)
x = random.randint(0, gl_width-width)
y = random.randint(0, gl_height-height)
color = (random.randint(0, 255), random.randint(0, 255), random.randint(0, 255))
shape = pyglet.shapes.Rectangle(x, y, width, height, color=color, batch=self.opengl.batch)
shape.opacity = random.randint(100, 255)
self.shapes.append(shape)
def clear_sprite_click(self):
for shape in self.shapes:
shape.delete()
self.shapes.clear()
class PygletWidget(OpenGLWidget):
def __init__(self, width, height, parent=None):
super().__init__(parent)
self.setMinimumSize(width, height)
self.timer = QtCore.QTimer()
self.timer.timeout.connect(self._pyglet_update)
self.timer.setInterval(0)
self.timer.start()
def _pyglet_update(self):
# Tick the pyglet clock, so scheduled events can work.
pyglet.clock.tick()
# Force widget to update, otherwise paintGL will not be called.
self.update() # self.updateGL() for pyqt5
def paintGL(self):
"""Pyglet equivalent of on_draw event for window"""
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT)
self.batch.draw()
def initializeGL(self):
"""Call anything that needs a context to be created."""
self.batch = pyglet.graphics.Batch()
size = self.size()
w, h = size.width(), size.height()
self.projection = pyglet.window.Projection2D()
self.projection.set(w, h, w, h)
if __name__ == '__main__':
app = QtWidgets.QApplication(sys.argv)
window = QtWidgets.QMainWindow()
ui = MainWidget(window)
ui.show() # Calls initializeGL. Do not do any GL stuff before this is called.
app.exec() # exec_ in 5.
Related
I've created a gui using PyQt5 in PyCharm and I've managed to get one QLabel with an image in it (Picture1.png) showing up, however, when I try to add a second QLabel with a second image (named Shutter1.png) on the same window, it seems to remove both labels and nothing shows up on the gui. I'm not sure where I'm going wrong and any help would be greatly appreciated, I'm a novice! NB I've doublechecked the filepath for both imagePath and imagePath_1 are correct. See below for attached code:
from PyQt5 import uic, QtWidgets, QtGui, QtCore
import sys
import pkg_resources
import functions.initialisation as inits
import functions.Sig2Open as S2O
import functions.Sig2Close as S2C
class Ui(QtWidgets.QMainWindow):
def __init__(self):
super(Ui, self).__init__()
self.gui = uic.loadUi('Shuttergui.ui', self)
# Creates the path of the image
self.imagePath = "C:/........../Picture1.png"
self.label = QtWidgets.QLabel(self.gui)
self.image = QtGui.QImage(self.imagePath)
self.pixmapImage = QtGui.QPixmap.fromImage(self.image)
self.label.setPixmap(self.pixmapImage)
self.label.resize(self.width(), self.height())
self.label.move(60, 170)
self.imagePath = "C:/....../Shutter1.png"
# Create label that holds the image in imagePath
self.label_1 = QtWidgets.QLabel(self.gui)
self.image_1 = QtGui.QImage(self.imagePath)
self.pixmapImage_1 = QtGui.QPixmap.fromImage(self.image_1)
self.label_1.setPixmap(self.pixmapImage_1)
self.label_1.resize(self.width(), self.height())
self.label_1.move(60, 170)
self.gui.showMaximized()
# redirect closeevent func to main self rather than inside gui
self.gui.closeEvent = self.closeEvent
# Initialise shutter functions
inits.ardopenup(self)
inits.ardshutup(self)
self.gui.show()
def closeEvent(self, event):
import time
time.sleep(0.1)
print("main thread quitting")
if __name__ == '__main__':
app = QtWidgets.QApplication(sys.argv)
app.setStyleSheet(pkg_resources.resource_stream(__name__, '/css/darktheme/style.css').read().decode())
window = Ui()
sys.exit(app.exec_())
I would like to ask how do I go about including a folium map into PyQt 5 window application such that the map does not take up the whole window. I have found a similar post on StackOverflow "How to show Folium map inside a PyQt5 GUI?", however, the solution code provided shown the folium map takes up the whole of the PyQt 5 window application.
So my question is how do I include the folium map but only takes up a portion of the PyQt 5 window application? As shown below, I am trying to include the map into the rectangle area. *The rectangle black box is drawn on paint for reference purposes.
FYI I have tried out the solution code from the StackOverflow post but I can't seem to be able to resize the map.
WANTED OUTPUT
CURRENT CODE FOR REFERENCE
from PyQt5.QtWidgets import QMainWindow, QApplication, QPushButton
from PyQt5 import QtWebEngineWidgets
import sys
from PyQt5 import QtGui
from PyQt5.QtCore import QRect
class Window(QMainWindow):
def __init__(self):
super().__init__()
self.title = "MAP PROJECT"
self.left = 200
self.top = 100
self.width = 1500
self.height = 800
self.initWindow()
def initWindow(self):
# set window title
self.setWindowTitle(self.title)
# set window geometry
# self.setGeometry(self.left, self.top, self.width, self.height)
# Disable PyQt 5 application from resizing
self.setFixedSize(self.width, self.height)
self.buttonUI()
self.show()
def buttonUI(self):
shortPathButton = QPushButton("Find shortest path", self)
# (set button location (x, x) set button size (y, y)
shortPathButton.setGeometry(QRect(30, 300, 120, 50))
button2 = QPushButton("Another path", self)
# (set button location (x, x) set button size (y, y)
button2.setGeometry(QRect(30, 370, 120, 50))
button3 = QPushButton("Another path", self)
# (set button location (x, x) set button size (y, y)
button3.setGeometry(QRect(30, 440, 120, 50))
# Below code is to connect the button to the function
# button.clicked.connect(self.ClickMe)
# Create function for shortest path (A* algorithm)
"""def ClickMe(self):
print("Hello World")"""
if __name__ == "__main__":
App = QApplication(sys.argv)
window = Window()
sys.exit(App.exec())
The problem has nothing to do with a QWebEngineView or folium but how to place widgets inside the window, if so, then a solution is to use layouts in this case I will use the following structure: First a central widget is established, inside this one QHBoxLayout , and in the QHBoxLayout a QWidget is added as a container to the left side where a QVBoxLayout will be placed where the buttons will be, and to the right side the QWebEngineView:
import io
import sys
import folium
from PyQt5 import QtCore, QtGui, QtWidgets, QtWebEngineWidgets
class Window(QtWidgets.QMainWindow):
def __init__(self):
super().__init__()
self.initWindow()
def initWindow(self):
self.setWindowTitle(self.tr("MAP PROJECT"))
self.setFixedSize(1500, 800)
self.buttonUI()
def buttonUI(self):
shortPathButton = QtWidgets.QPushButton(self.tr("Find shortest path"))
button2 = QtWidgets.QPushButton(self.tr("Another path"))
button3 = QtWidgets.QPushButton(self.tr("Another path"))
shortPathButton.setFixedSize(120, 50)
button2.setFixedSize(120, 50)
button3.setFixedSize(120, 50)
self.view = QtWebEngineWidgets.QWebEngineView()
self.view.setContentsMargins(50, 50, 50, 50)
central_widget = QtWidgets.QWidget()
self.setCentralWidget(central_widget)
lay = QtWidgets.QHBoxLayout(central_widget)
button_container = QtWidgets.QWidget()
vlay = QtWidgets.QVBoxLayout(button_container)
vlay.setSpacing(20)
vlay.addStretch()
vlay.addWidget(shortPathButton)
vlay.addWidget(button2)
vlay.addWidget(button3)
vlay.addStretch()
lay.addWidget(button_container)
lay.addWidget(self.view, stretch=1)
m = folium.Map(
location=[45.5236, -122.6750], tiles="Stamen Toner", zoom_start=13
)
data = io.BytesIO()
m.save(data, close_file=False)
self.view.setHtml(data.getvalue().decode())
if __name__ == "__main__":
App = QtWidgets.QApplication(sys.argv)
window = Window()
window.show()
sys.exit(App.exec())
I have this code as follows:
import sys
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
if __name__ == "__main__":
app = QApplication(sys.argv)
w = QWidget()
eff = QGraphicsOpacityEffect(w)
anim = QPropertyAnimation(eff, b"opacity")
btn = QPushButton("Button", w)
btn.clicked.connect(w.close)
eff.setOpacity(0)
w.setAutoFillBackground(True)
w.setGraphicsEffect(eff)
w.show()
anim.setDuration(10000)
anim.setStartValue(0)
anim.setEndValue(1)
anim.start()
sys.exit(app.exec_())
It works fine (fade in effect). However, when I resize the window, the animation restarts, causing the window to blink/flicker during resize. If I remove the call to animate after the call to show, no more blink (but no more fade in).
Moreover, after some time, resizing to a much bigger size causes a white rectangle over a black background to be displayed.
Is there something I am missing?
UPDATE
This is the behavior I am looking for (background remains white, i.e. opacity=1, after the animation run once). Works with the following code but does not look like best practice to do it like this.
import sys, time
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
class MyWidget(QWidget):
def __init__(self):
super().__init__()
self.w = QWidget()
self.w.setMinimumSize(400,400)
self.w.resizeEvent = self.selfOnResize # added this
def animate(self):
self.eff = QGraphicsOpacityEffect(self.w)
self.anim = QPropertyAnimation(self.eff, b"opacity")
self.btn = QPushButton("Button", self.w)
self.btn.clicked.connect(self.w.close)
self.eff.setOpacity(0)
self.w.setAutoFillBackground(True)
self.w.setGraphicsEffect(self.eff)
self.w.show()
self.anim.setDuration(100000)
self.anim.setStartValue(0)
self.anim.setEndValue(1)
self.anim.start()
# this fixes the issue but looks like a dirty hack
def selfOnResize(self, event):
self.eff.setOpacity(1)
# print(event)
if __name__ == "__main__":
app = QApplication(sys.argv)
w = MyWidget()
w.animate()
sys.exit(app.exec_())
I have a QMainWindow containing a child QWidget containing itself a QLabel.
When the window is maximized (e.g. by clicking the maximize icon on the window), the QLabel.resizeEvent() handler is called multiple times (supposedly to follow the progressive enlargement of the window until it takes the full desktop space).
The code in the event handler calls setPixmap() to scale the label pixmap. This is a relatively long operation which slows the process. Code for the label:
from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import QWidget, QLabel, QFrame, QGridLayout
from PyQt5.QtGui import QImageReader, QPixmap
class DisplayArea(QLabel):
def __init__(self):
super().__init__()
self.pix_map = None
self.init_ui()
def init_ui(self):
self.setMinimumSize(1, 1)
self.setStyleSheet("border:1px solid black;")
def set_image(self, image):
self.pix_map = QPixmap.fromImage(image)
self.scale_image(self.size())
def scale_image(self, size):
if self.pix_map is None:
return
scaled = self.pix_map.scaled(size, Qt.KeepAspectRatio)
self.setPixmap(scaled)
def resizeEvent(self, e):
self.scale_image(e.size())
super().resizeEvent(e)
Is there a possibility to process the event only once, when the window has reached its final size?
The problem is that the resizeEvent is called many times in the time that the window is maximized, and that same number of times is what you call scale_image. One possible possible is not to update unless a period of time passes. In the following example only resizes for times greater than 100 ms (the time you must calibrate):
from PyQt5 import QtCore, QtGui, QtWidgets
class DisplayArea(QtWidgets.QLabel):
def __init__(self):
super().__init__()
self.pix_map = QtGui.QPixmap()
self._flag = False
self.init_ui()
def init_ui(self):
self.setMinimumSize(1, 1)
self.setStyleSheet("border:1px solid black;")
def set_image(self, image):
self.pix_map = QtGui.QPixmap.fromImage(image)
self.scale_image()
def scale_image(self):
if self.pix_map.isNull():
return
scaled = self.pix_map.scaled(self.size(), QtCore.Qt.KeepAspectRatio)
self.setPixmap(scaled)
def resizeEvent(self, e):
if not self._flag:
self._flag = True
self.scale_image()
QtCore.QTimer.singleShot(100, lambda: setattr(self, "_flag", False))
super().resizeEvent(e)
if __name__ == '__main__':
import sys
app = QtWidgets.QApplication(sys.argv)
w = QtWidgets.QMainWindow()
da = DisplayArea()
da.set_image(QtGui.QImage("logo.png"))
w.setCentralWidget(da)
w.show()
sys.exit(app.exec_())
I have a small Python script that makes a transparent window for displaying a graphic on screen and I'd like to animate that graphic, but am entirely unsure how or where to even start. Here's what I do have at least:
import sys
from PyQt4 import QtGui, Qt, QtCore
class Transparent(QtGui.QWidget):
def __init__(self):
QtGui.QWidget.__init__(self)
self.setAttribute(Qt.Qt.WA_NoSystemBackground)
self.setAutoFillBackground(True)
pixmap = QtGui.QPixmap("test1.gif")
pixmap2 = QtGui.QPixmap("test2.gif")
width = pixmap.width()
height = pixmap.height()
self.setWindowTitle("Status")
self.resize(width, height)
self.label = QtGui.QLabel(self)
def animateEvent():
imgnumber = 0
try:
if imgnumber == 1:
self.label.setPixmap(QtGui.QPixmap("test1.gif"))
self.setMask(pixmap.mask())
imgnumber = 0
else:
self.label.setPixmap(QtGui.QPixmap("test2.gif"))
self.setMask(pixmap2.mask())
imgnumber = 1
finally:
QtCore.QTimer.singleShot(1000, animateEvent)
animateEvent()
def paintEvent(self,event):
self.setAttribute(Qt.Qt.WA_NoSystemBackground)
if __name__ == "__main__":
app = QtGui.QApplication(sys.argv)
x = Transparent()
x.show()
app.exec_()
This feels like it has the right ingredients, but the pixmap doesn't update.
I tried QMovie, but then the area of the window that is supposed to be transparent is filled with black instead.
check out this code from www.daniweb.com and see if you can modify it to your needs:
import sys
from PyQt4.QtCore import *
from PyQt4.QtGui import *
class MoviePlayer(QWidget):
def __init__(self, gif, parent=None):
super(MoviePlayer, self).__init__(parent)
self.setGeometry(200, 200, 400, 400)
self.setWindowTitle("QMovie to show animated gif")
self.movie_screen = QLabel()
self.movie_screen.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Expanding)
self.movie_screen.setAlignment(Qt.AlignCenter)
btn_start = QPushButton("Start Animation")
btn_start.clicked.connect(self.start)
btn_stop = QPushButton("Stop Animation")
btn_stop.clicked.connect(self.stop)
main_layout = QVBoxLayout()
main_layout.addWidget(self.movie_screen)
main_layout.addWidget(btn_start)
main_layout.addWidget(btn_stop)
self.setLayout(main_layout)
self.movie = QMovie(gif, QByteArray(), self)
self.movie.setCacheMode(QMovie.CacheAll)
self.movie.setSpeed(100)
self.movie_screen.setMovie(self.movie)
def start(self):
"""
Start animation
"""
self.movie.start()
def stop(self):
"""
Stop the animation
"""
self.movie.stop()
app = QApplication(sys.argv)
player = MoviePlayer("/path/to/image.gif")
player.show()
sys.exit(app.exec_())
This ended up being a simple correction of an oversight in the end.
imgnumber needed to be outside of the def as self.imgnumber and needed to be named self.imgnumber each time it was changed.
First, just make sure your animated gif really does have a proper transparent background. The following code works for me, using this fire image as a source:
class Transparent(QtGui.QWidget):
def __init__(self):
QtGui.QWidget.__init__(self)
self.setAttribute(QtCore.Qt.WA_NoSystemBackground)
self.setWindowFlags(QtCore.Qt.FramelessWindowHint)
filename = "test.gif"
size = QtGui.QImage(filename).size()
self.setWindowTitle("Status")
layout = QtGui.QVBoxLayout(self)
layout.setMargin(0)
self.movie = QtGui.QMovie(filename)
self.label = QtGui.QLabel(self)
self.label.setMovie(self.movie)
layout.addWidget(self.label)
self.resize(size)
self.movie.start()
This will create a completely transparent and frameless window, with the animated gif playing in a QMovie. There is no black being drawn behind the image. It should fully see through to what ever is underneath.
It is not so far off from your original code. You shouldn't need to set the mask, or do a paint event.