Results 1 to 5 of 5

Thread: simple image slide show using property animations

  1. #1
    Join Date
    Aug 2020
    Posts
    3
    Qt products
    Qt5
    Platforms
    Unix/X11 Windows

    Exclamation simple image slide show using property animations

    As a home developer this is my first post to any development forum. Although I am using Python this was the best QT forum I could find so apologies : but my question is probably applicable to c++ as well.

    I think I must be missing something with animations.

    I am trying to use a QtWidgets.QLabel (lblPhotoDisplay) containing an image to create a simple animated slide show using fade/unfade methods (see below). Chaining the methods using the animation.finished trigger seemed the obvious (to me at least) way to achieve this.

    I am calling the fade method from a displayImage method and using the animation.finished trigger to change the image then call the unfade method which unfades with its animation.finshed submitting a job to change the image again at a specified time.

    My problem is that everything works OK first time the fade animation is called. Subsequent calls fail to trigger fade animation.finished.

    What am I missing -- do animation not chain like this?



    def fade(self):
    self.effect = QGraphicsOpacityEffect()
    self.lblPhotoDisplay.setGraphicsEffect(self.effect )

    self.animation = QtCore.QPropertyAnimation(self.effect, b"opacity")
    self.animation.setDuration(1000)
    self.animation.setStartValue(1)
    self.animation.setEndValue(0)
    self.animation.finished.connect(self.changeImage)
    self.animation.start()

    def unfade(self):
    self.effect = QGraphicsOpacityEffect()
    self.lblPhotoDisplay.setGraphicsEffect(self.effect )

    self.animation = QtCore.QPropertyAnimation(self.effect, b"opacity")
    self.animation.setDuration(1000)
    self.animation.setStartValue(0)
    self.animation.setEndValue(1)
    self.animation.finished.connect(self.nextImage)
    self.animation.start()

  2. #2
    Join Date
    Jan 2008
    Location
    Alameda, CA, USA
    Posts
    4,721
    Thanks
    259
    Thanked 760 Times in 750 Posts
    Qt products
    Qt5
    Platforms
    Windows Android

    Default Re: simple image slide show using property animations

    My first impression is that almost all of the "setup" code here:

    Qt Code:
    1. self.effect = QGraphicsOpacityEffect()
    2. self.lblPhotoDisplay.setGraphicsEffect(self.effect )
    3.  
    4. self.animation = QtCore.QPropertyAnimation(self.effect, b"opacity")
    5. self.animation.setDuration(1000)
    6. self.animation.setStartValue(1)
    7. self.animation.setEndValue(0)
    8. self.animation.finished.connect(self.changeImage)
    To copy to clipboard, switch view to plain text mode 

    should be in the __init__ method of your class. You do not need to create the animation, connect slots, etc. every time you want to fade or unfade. In __init__ you should create the animation, set the graphics effect, etc. and the only thing you do in the fade() and unfade() methods is to set the direction of the property change:

    Qt Code:
    1. def __init__( self ) :
    2. self.effect = QGraphicsOpacityEffect()
    3. self.lblPhotoDisplay.setGraphicsEffect(self.effect )
    4. self.animation = QtCore.QPropertyAnimation(self.effect, b"opacity")
    5. self.animation.setDuration(1000)
    6. self.animation.finished.connect(self.animationFinished)
    7. self.fadeDirection = 0
    8.  
    9. def fade(self):
    10. self.animation.setStartValue(1)
    11. self.animation.setEndValue(0)
    12. self.fadeDirection = 0
    13. self.animation.start()
    14.  
    15. def unfade(self):
    16. self.animation.setStartValue(0)
    17. self.animation.setEndValue(1)
    18. self.fadeDirection = 1
    19. self.animation.start()
    20.  
    21. @Slot()
    22. def animationFinished( self )
    23. if self.fadeDirection == 0 :
    24. self.changeImage()
    25. else :
    26. seld.nextImage()
    To copy to clipboard, switch view to plain text mode 

    The way your code is written, you are creating a new animation instance every time the fade() or unfade() methods are called and connecting that new instance to one of your two slots. Basically, you are creating two animation instances for every picture and building a rat's nest of signal / slot connections between them. Most QObject-based classes in Qt are generally best created once and reused, and signals and slots connected once, in a constructor.
    Last edited by d_stranz; 14th August 2020 at 00:59.
    <=== The Great Pumpkin says ===>
    Please use CODE tags when posting source code so it is more readable. Click "Go Advanced" and then the "#" icon to insert the tags. Paste your code between them.

  3. #3
    Join Date
    Aug 2020
    Posts
    3
    Qt products
    Qt5
    Platforms
    Unix/X11 Windows

    Default Re: simple image slide show using property animations

    Thanks - d_stanz:
    Rewrote the code as per your suggestion (much better) and although it made no difference to the operation of the animation your suggestion set me on the path to finding the issue. I then switched to debugging in visual studio code on windows (deploying to the pi later) rather than directly on the Raspberry pi. This showed that the animation was running in a separate thread second time around -- as result of using apscheduler and pydispatch to manage the timed image change. Worked perfectly when I got it running on the main thread. The apscheduler and pydispatch mechanism was carried over from a previous development of message Queue based sensor stations that don't have GUI components. Will now remove pydispatch and use signals /slots.
    Thanks again

  4. #4
    Join Date
    Jan 2008
    Location
    Alameda, CA, USA
    Posts
    4,721
    Thanks
    259
    Thanked 760 Times in 750 Posts
    Qt products
    Qt5
    Platforms
    Windows Android

    Default Re: simple image slide show using property animations

    In Qt (at least the C++ implementation, which I am sure the Python implementation is just layered on top of), all GUI activity has to occur in the main thread (the one that holds the QApplication instance). You can do other Qt things in threads (like manipulate images and such) but when it comes to displaying them, that has to happen in the main thread.
    <=== The Great Pumpkin says ===>
    Please use CODE tags when posting source code so it is more readable. Click "Go Advanced" and then the "#" icon to insert the tags. Paste your code between them.

  5. #5
    Join Date
    Aug 2020
    Posts
    3
    Qt products
    Qt5
    Platforms
    Unix/X11 Windows

    Default Re: simple image slide show using property animations

    What was interesting this time was there was no exception raised, as has been true on the other occasions I have tried to update the ui from a different thread. That's why I thought it was my understanding rather than a problem with my code. Thanks

Similar Threads

  1. Slide Show using QGraphicscene
    By Surendark in forum Newbie
    Replies: 1
    Last Post: 26th March 2015, 14:07
  2. Create slide show
    By iswaryasenthilkumar in forum Newbie
    Replies: 2
    Last Post: 4th December 2014, 12:55
  3. a set of images slide show on a single QLabel
    By lyw8120 in forum Qt Programming
    Replies: 9
    Last Post: 17th March 2014, 14:19
  4. Slide show using QProperty animation
    By mvbhavsar in forum Newbie
    Replies: 0
    Last Post: 10th August 2011, 11:24
  5. slide show
    By jeetu_happy in forum Qt Programming
    Replies: 3
    Last Post: 18th January 2007, 13:21

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.