[UDD]Timers and Frame by frame Animation

[Geistbas]

At this moment things are going in the right direction with one of my projects in terms of features and since I found RenPy's drag and drop class rather confusing to me, I decided to code my own drag and drop in an UDD class, which worked just perfectly, and I got the desired results.
However, while also deciding to code an UDD context menu in the very same class instead of using screens because screens were not showing/updating until I interacted with something in the GUI (button click), I then nodded to actually code every single thing about the inventory in UDDs. Why not? It only seems to make more sense that way.

So it's like this, when I click on an item in the inventory, the context/popup menu also contained in the same UDD class shows up. When I click on "Item Info" on it, a large card should appear on the screen, which is supposed to contain various information about the item.

However, I want the card to appear in a snazzy way, and i even put together a 16-frame GIF animation to demonstrate what I mean:


Now ignoring the transparency limitations of GIF, I mean that:

Code: Select all

#Render the card desc.
if self.inCardDesc == True:
    
    
    cardpos = ((self.width / 2) - (self.cdescw / 2), (self.height / 2) - (self.cdesch / 2))
    
    dcardrender = renpy.render(self.cdBG, self.cdescw, self.cdesch, st, at)
    render.blit(dcardrender, cardpos)

    ###To do: render the actual item contents
    
    animrender = renpy.render(renpy.displayable("cardview"), self.cdescw, self.cdesch, st, at)
    render.blit(animrender, cardpos) ##Does not work

It is still an unfinished draft, and i still haven't done any actual content such as item's name, attributes, and description, but this very basic draft should say that there are two main parts for this:

- The card description background itself
---- (contents rendered on the card)
- Overlay 16 frame animation that plays when the Item Info state is triggered and shown on the screen.

I however do not know how to make an animation with UDDs, but even if I knew, that doesn't end there:

Code: Select all

image cardview:
    "images/interface/info/cr01.png"
    pause 0.05
    "images/interface/info/cr02.png"
    pause 0.05
    "images/interface/info/cr03.png"
    pause 0.05
    "images/interface/info/cr04.png"
    pause 0.05
    "images/interface/info/cr05.png"
    pause 0.05
    "images/interface/info/cr06.png"
    pause 0.05
    "images/interface/info/cr07.png"
    pause 0.05
    "images/interface/info/cr08.png"
    pause 0.05
    "images/interface/info/cr09.png"
    pause 0.05
    "images/interface/info/cr10.png"
    pause 0.05
    "images/interface/info/cr11.png"
    pause 0.05
    "images/interface/info/cr12.png"
    pause 0.05
    "images/interface/info/cr13.png"
    pause 0.05
    "images/interface/info/cr14.png"
    pause 0.05
    "images/interface/info/cr15.png"
    pause 0.05
    "images/interface/info/cr16.png"

I tried various ways to use a pre-defined animation in UDDs but I don't seem to be able to do so this way. Using renpy.displayable("cardview") makes it render the animation's last frame only, without any animation at all.

Now, for the timer, since the 16-frame white overlays have no pixels in the middle part, I can't just render both the card and the animated effect at the same moment, because it would show the BG card with the white animation over it on < Frame 10, which is the frame where the two sides, left and right fully connect.

For this I want to achieve the following:

1.Render the white overlay as the first visible thing to the user. (but located below the card BG code so it layers on top of it, which means an if block)
2. Make the card BG (the green card) appear once frame 10 of the white overlay animation has passed, which is 0.5 seconds since the beginning of the animation/item info state entry.

This would make it actually possible to make the BG card display data about the item while the flashy animation is still running, because the 6 last frame PNGs have transparent areas. It would certainly seem like an interesting thing to see for those last 0.3 seconds. The whole animation lasting for 0.8 seconds since I don't want to annoy the user.

So how do I implement a timer in UDDs to postpone the rendering of the data card itself (below a 0.8 second animation) by 0.5 seconds, may I ask? About how to implement a proper frame-by-frame sequence in UDDs, I do wonder about that too!

Kind regards.