- Home /
How to show two 2D animations at the same time?
I've looked all around, and I know this is a fairly prevalent topic, but I haven't found anything that can fix my problem.
GOAL: Show 2 different 2D animations at the same time, on top of one another
The question is, how do I do this? How can I show two animations at the same time? For an example, below is a small example sprite sheet (with 3 sprites haha) of a spaceship and the fire coming out of the back.
Let's imagine the spaceship is an animation, PlayerMain, and is always showing (with the loop off). Then, the 2 sprite fire animation is set up as another animation, as PlayerMainJetAnim. See the link here for a screenshot of the example in the Animator window.
What I want to happen is that the spaceship is always shown. Then, when the user presses a certain key, the fire animation appears directly on top of the spaceship, making it look like the fire is coming out the back of the spaceship. You should see both, and theoretically, both animations would be running at the same time.
How can I do this? I've tried layers (as you can see in the animator window), I've tried messing with tons of settings, but the only thing I can get to happen is when the user presses the up key, the fire animation is playing, but the ship is gone... both aren't happening at the same time. I've checked and tried answers from different questions here and everywhere, and nothing I try is working. Preferably, I would like to keep all the animation work in the animator window, and not have to play them through a animation play() method in code. (Note- I do set a boolean to true when the user presses the up key in the code, initiating the change of animation from PlayerMain to PlayerMainJetAnim. That works fine, and I'm fine with that, but don't want to do any animation play() stuff in code if possible. If I have to, however, and there's no other choice, that's fine.) How can I get these to play at the same time?
Thanks for reading this and the help. Let me know if I need to clarify it more.
2nd Note- I've tried different combinations of the layers in the animator- and tried setting the Jets layer to additive, as you can see in the picture. Here is a screenshot of the jets layer.
Answer by hyperi0n · Jan 08, 2016 at 10:02 AM
I am not sure I understood you correctly - are you using one single object with a sprite renderer? Wouldn't it be an option to have 2 separate sprites overlayed on top of each other, one for the main ship and one for the fire effect? Then you would for example parent the fire to the ship (or make both children of a single shared parent). This would give you much more control over both the ship (such as changing the color of the sprite during gametime to indicate damage, different ships,...) and the fire (maybe use the alpha/transparency of the sprite to fade the effect in and out...
Sorry for the confusion! I have one object, and the main ship is in the sprite renderer. And I want to do that- overlay them on top of each other- but is it possible to do it as one object? Not with a parent object and child objects? I think there should be some way to do that with animation? If not then, that's a great solution! Thanks!
Hmm, though this has been asked before I couldn't find any definitive/perfect solution... The closest thing I found was this thread http://forum.unity3d.com/threads/2d-sprite-with-multiple-body-parts.224146/ (?) but it's also not clear if the "solution" worked.. To be honest, I would probably go with the parent-child idea, especially for such a "simple" application like ship plus exhaust-gas..
Though if you absolutely want to stick with one animated sprite, why not change the sprite sheet so that you have the ship 3 times, once without fire and than once each with of the fire variants, and then simply animate through these 2 frames when the ship is accelerating and swith to the clean fram when it is not. Then you could also for example add a bit of orange "glow" to the bottom side of the ship's hull to look even better. Of course the image file would be a bit bigger, but I think in these dimensions (very low-res pixel graphics) this is completely negligable.
Sorry that I can offer only alternatives and no actual answer/solution to your original goal..