Trying to learn something new, animating image in Qt dialog

Was learning different youtube channels from people who teach code. I stumble one to this one and wanted to learn how this person got this Python with qt designer to work.

This is the channel https://www.youtube.com/watch?v=FTs4phOn-fo

Here is my code. But doesn’t come out quite right.
thank for anyone willing to help
trying to get it to loop randomly before it choose the dice.

import sys                        # needed for the sys.argv passed to QApplication below (command line arguments)

from PyQt6.QtWidgets import QDialog, QApplication, QLabel, QPushButton
from PyQt6.QtGui import QPixmap
from PyQt6.uic import loadUi
from PyQt6.QtCore import QTimer, Qt
from time import sleep
from random import randint

class MyForm(QDialog):
    def __init__(self):
        super().__init__()
        self.ui = loadUi('dice_lastname.ui', self)

        self.pushButtonRoll = self.ui.pushButtonRoll
        self.pushButtonExit = self.ui.pushButtonExit

        # Connect buttons to methods
        self.pushButtonRoll.clicked.connect(self.rollMethod)
        self.pushButtonExit.clicked.connect(QApplication.instance().quit)

        # Create a QTimer for updating the LCD widget
        self.timer = QTimer(self)
        self.timer.timeout.connect(self.showLCD)
        self.timer.start(1000)  # Update every second

    def displayImage(self, filename, label):
        pixmap = QPixmap(filename)
        label.setPixmap(pixmap)

    def showLCD(self):
        # Implement this method to update the IcdNumber widget with the current time
        pass

    def rollMethod(self):
        self.displayImage("Die6.BMP", self.labelDie1)
        self.displayImage("Die6.BMP", self.labelDie2)

        for i in range(1, 7):
            filename = f"Die{i}.BMP"
            self.displayImage(filename, self.labelDie1)
            self.displayImage(filename, self.labelDie2)
            sleep(0.08)
        final_roll = randint(1, 6)
        roll1 = random.randint(1, 6)
        final_filename = f"Die{final_roll}.BMP"
        self.displayImage(final_filename, self.labelDie1)
        self.displayImage(final_filename, self.labelDie2)
        
    def exitMethod(self):
        # the following code quits the application.
        # It is connected to the Exit push button in the
        # constructor above.
        QApplication.instance().quit()
        

# the code below should not be changed and is constant for all GUI programs
if __name__=="__main__":    
    app = QApplication(sys.argv)
    window = MyForm()
    window.show()         
    sys.exit(app.exec())  # note - sys.exit causes traceback in some editors if it does in yours just use app.exec()

Hey Joseph, what do you mean by

is it the general working of the app or the appearance of the GUI?

My apologies for not informing the full error. Yes the gui shows up. However, the execution comes out with no timer running, as well as the dice not being randomizing in a loop 6 times before it chooses a dice. And needing both dice to randomly simulate a roll just like the video. Thank you for ur responses and time :pray:

This will not animate the screen.
It just updates the image that will be shown when Qt later does draw when the Qt event loop can run.
Which will be after the method returns.

i dont if this could be the problem if you have already imported randint from random then use ranint and dont mix so make roll1 = random.randint(1, 6) to be roll1 = randint(1, 6)
another part the timer is not running its because you haven’t implemented the showLCD() function

How do you animate it?

I removed it and it is still the same. It just shows the pictures at the same time and does not randomize the dice

So i manage to get the timer to run

class MyForm(QDialog):
    def __init__(self):
        super().__init__()
        self.ui = loadUi('dice_Cruz.ui', self)

        # Connect buttons to methods
        self.pushButtonRoll.clicked.connect(self.rollMethod)
        self.ui.pushButtonExit.clicked.connect( self.exitMethod)

        # Create a QTimer for updating the LCD widget
        timerLCD = QtCore.QTimer(self)
        timerLCD.timeout.connect(self.showlcd)
        timerLCD.start(1000)  # Update every second
        self.ui.lcdNumber.setStyleSheet("QLCDNumber { background: white; color: black; }")
        
        self.show()

    def displayImage(self, filename, label):
        pixmap = QPixmap(filename)
        label.setPixmap(pixmap)

    def showlcd(self):
        # Implement this method to update the IcdNumber widget with the current time
        time = QtCore.QTime.currentTime()
        text = time.toString('hh:mm:ss')
        self.ui.lcdNumber.display(text)

Now i need to find out how to animate the loop for the random dice roll.

To animate you need to use another timer and update the image each tick of the timer.

You will need to keep track of the state of your animation so that you can stop the timer after the last image update.

here is my code so far, but I need to know how to have Die1 and Die2 separately loop randomly. and finally having the program choosing a random Die for both.

import sys                        # needed for the sys.argv passed to QApplication below (command line arguments)

from PyQt6.QtWidgets import QDialog, QApplication, QLabel, QPushButton
from PyQt6.QtGui import QPixmap
from PyQt6.uic import loadUi
from PyQt6 import QtCore
from PyQt6.QtCore import QTimer
from time import sleep
from random import randint



class MyForm(QDialog):
    def __init__(self):
        super().__init__()
        self.ui = loadUi('dice_Cruz.ui', self)

        # Connect buttons to methods
        self.ui.pushButtonRoll.clicked.connect(self.rollMethod)
        self.ui.pushButtonExit.clicked.connect( self.exitMethod)
        
        self.exitFlag = False
        
        # Create a QTimer for updating the LCD widget
        timerLCD = QtCore.QTimer(self)
        timerLCD.timeout.connect(self.showlcd)
        timerLCD.start(1000)  # Update every second
        self.ui.lcdNumber.setStyleSheet("QLCDNumber { background: white; color: black; }")
        
        self.show()

    def displayMethod(self, filename):
        QApplication.processEvents()
        pixmap = QPixmap(filename)
        self.ui.labelDie1.setPixmap(pixmap)
        self.ui.labelDie1.repaint()
        QApplication.processEvents()
     
     
    def loopMethod(self):
        print("Entered timer tick")
        self.displayMethod( str(self.current_Die) + ".BMP")
        self.current_Die += 1
        
        if self.current_Die == 10:
            self.current_Die = 0
     
    def displayImage(self, filename, label):
        pixmap = QPixmap(filename)
        label.setPixmap(pixmap)   
    
    def showlcd(self):
        # Implement this method to update the IcdNumber widget with the current time
        time = QtCore.QTime.currentTime()
        text = time.toString('hh:mm:ss')
        self.ui.lcdNumber.display(text)

    def rollMethod(self):
        # Simulate rolling dice
        i = 0
        while True:
            if self.exitFlag:
                sys.exit(0)
            file = str(i) + ".BMP"
            filename = f"Die{i}.BMP" 
            self.displayImage(filename, self.labelDie1)
            self.displayImage(filename, self.labelDie2)
            sleep(0.25)
            i += 1
            QApplication.processEvents()
            if i == randint(1, 6):
                i = 0

````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````
If you please just don't say, " need to this or that" while not showing the code itself. trying to see how its done. I appreciate any help ya give. thanks

I do not have the time to write code to show you what to do.
However I can offer pointers.

Using QApplication.processEvents() may get the screen redrawn, but may get you code into trouble else where.

The idea is that you replace your while loop and its sleep() with a timer that calls the code

            self.displayImage(filename, self.labelDie1)
            self.displayImage(filename, self.labelDie2)

You already show you know how to do this for the showlcd() function.

This is code that animates a red circle that gets bigger then smaller to show where the cursor is in my editor.

You can see how I use the timer and track state to know when to stop.

The code is in the class EmacsCursorHighlighter that is here: https://github.com/barry-scott/BarrysEmacs/blob/master/Editor/PyQt6/be_emacs_panel.py#L1408