Multiple anim simulation in renpy

SciGuy

Member
May 8, 2018
167
168
I've been working on a game for a while now, and am wanting to do something with Renpy that may not even be possible. I'm setting up a scene where the MC and another toon are watching a video. The video is SUPPOSED to play in the background, while the toon's reactions to it are the focus of attention. Right now the toon's jaw drops, her head snaps to face the MC, and she makes a few funny remarks. She then turns back to continue watching the video.
In a perfect world, the background video will play independent of the foreground responses to it.
Right now the BG vid stops while the toon's response plays out because of all the pauses. Is there a method to produce what I'm envisioning? Doing it frame by frame with really short pauses is messy at best, and a NIGHTMARE trying to keep track of all the still images!
 

Rich

Old Fart
Modder
Donor
Respected User
Game Developer
Jun 25, 2017
2,565
7,378
When you say the background video "stops", do you mean that it completely freezes? Or that it just "stutters" a bit?

How are you playing the background video, and how are you doing the foreground animation? You should be able to do what you're talking about, unless you're running into frame rate problems with Ren'py.
 
  • Like
Reactions: Hairyhornyhog

SciGuy

Member
May 8, 2018
167
168
I've only been working with Renpy for about a week, so I'm sure there are much better ways to do things!
I haven't actually added the background video yet. I do have the character positioned on the right side of the screen with a 3/4 angle, set to watch a video that will display on the right, also at a 3/4 angle. I can pull all that off so the 2 animations won't overlap.
The character anim is built on 7 png's. The start position will stay in place until a certain point in the bg video when her jaw drops, she turns her head and says a line, and turns back to continue watching.
There will eventually be 3 different vids. All animations are built with pauses between frames, but I haven't put them in yet because I don't know how to proceed!
I'm really struggling with Renpy still. I can't seem to get the position commands right! I've been trying to get xpos and ypos ironed out to make a char leave through a door, but the syntax I'm using throws errors. Maybe someone can help with this too. Here's what I'm trying to use:
show erica leave:
xpos 0.8 ypos 0.5
with move
pause (.1)
hide erica
This gives an error that it's expecting a statement between the 0 and the .8 in xpos
The tut explains what the different commands are supposed to do, but NOT the exact syntax to use when including them!
I've got a couple thousand lines of dialogue now, and most of the character movements are using simple positions like at right, at center, with (transition), etc. Getting the exact positions where I want will just take a little time to figure out once I get the syntax right, but this animation sequence has me at a loss.
I'm trying to 'polish' some things now, and I'm expanding beyond the tutorials.
 

Rich

Old Fart
Modder
Donor
Respected User
Game Developer
Jun 25, 2017
2,565
7,378
OK, @SciGuy. It's a bit hard to figure out exactly what's going on without seeing the indentation, but here are some basics.
I'm assuming what you meant was
Code:
show erica leave:
    xpos 0.8 ypos 0.5
with move
pause (.1)
hide erica
Although what you are trying to do is legal (although you might have indentation issues), it's not necessarily best practice.

Things like "xpos, ypos, etc." are used within screens to position stuff and to define transforms. So let's assume that you have a character that you want to start out at 0.8, 0.5, and then you want to have that character exit off the screen to the right. What you can do is to define an animation transform that does that:

Code:
transform move_off_to_right:
    xpos 0.8 ypos 0.5
    ease 1.0 xpos 1.2
This defines a transform that starts the character at (0.8, 0.5) and then, over a period of one second, animates it to (1.2, 0.5), using the "ease" warping (which starts out slow, speeds up, and then slows down at the other end).

Then what you can do is:
Code:
    show erica leave at move_off_to_right
    hide erica
(I'm assuming that "erica leave" is one of your images.)

If you had any "erica" image on the screen before you executed this, that erica image would be replaced by "erica leave", and then the "erica leave" image would slide off to the right. The game will pause automatically while this animation is going on, then will continue with the next game statement, which will hide the erica image. (Even though it's off-screen, unless you hide it, it's still taking up resources, because Ren'py is thinking you might want to move it back onscreen. So maybe before that, you'd also have

Code:
transform watching_the_tv
    xpos 0.8 ypos 0.5
and what you'd do is

Code:
    show erica at watching_the_tv
    e "Hey, good program."
    e "but it's time to leave"
    show erica leaving at move_off_to_right
    hide erica
The first transform puts erica in the spot to watch the TV, without any motion. Then she gets replaced (at the same spot on the screen, since both transforms start out at the same spot) by "erica leaving" and slides away.

The "at" notation introduces a transform onto another image, which is used to move an image around, scale it, etc., while "with" introduces a transition - things like "dissolve". You can mix the two, but it gets trickier. But when you do the "show" command, you generally want to have pre-defined the transforms.

(BTW, don't mix the transforms into your text sequences - it works, but it's ugly. Define them at the top of the file or at the bottom, or in their own file. It'll save you - and the Renpy parser - a lot of hassle)

You can also create images that have transforms built in. For example, another way to do the above is:

Code:
image erica leaving_to_right:
    "the_erica_image.png"
    xpos 0.8 ypos 0.5
    ease 1.0 xpos 1.2
Displaying this image:
Code:
    show erica at watching_the_tv
    e "Hey, good program."
    e "but it's time to leave"
    show erica leaving_to_right
    hide erica
does basically the same thing as the above. When you tack the transform declarations onto the image declaration, what Ren'py does is take the PNG, wrap it in a Transform and then save that as "erica leaving_to_right", so by showing that image, you're essentially bringing along the "at" transform without having to name it.

Hopefully that starts getting you on the correct track.
 

SciGuy

Member
May 8, 2018
167
168
You pointed out about half a dozen things I've been doing wrong, jeez!
What I've got does work (except for properly positioning the char with xpos and ypos), but it's really sloppy. I'll get erica to move off the screen w/o throwing errors, then go back through a 2nd time and define all my transforms.
My next real project is going to be making a new style phone. The game's set about 100 yrs in the future, and the phone is a heads-up display. I've got working code for the basic mechanics, but I made it at a different rez (I did it as it's own game to get it working) and will have to re-work that too.
Thanks for the pointers. The further I get into this project, the more I like how it's turning out. I hope I don't get overwhelmed and give up on the stupid thing - it has potential.
 

Rich

Old Fart
Modder
Donor
Respected User
Game Developer
Jun 25, 2017
2,565
7,378
You pointed out about half a dozen things I've been doing wrong, jeez!
It's worth saying that just because you're doing something differently, doesn't necessarily mean that it's wrong. One of the things about Ren'py is that it's evolved so much over the years that there are frequently multiple ways to do things. In many cases, there were older (slightly clunkier) ways of doing something, and then PyTom introduced a new more elegant (and frequently more performant) way of doing it. But the old way will still work. Case in point - the LayeredImage support introduced in 7.0 - you could do the same things with "Composite" (formerly "LiveComposite"), but LayeredImage is a bit more flexible, and performs better. Ditto ImageButtons over ImageMaps.
 
  • Like
Reactions: Hairyhornyhog