Author Topic: Explosions and animations.  (Read 3756 times)

kacamac

  • Member
  • **
  • Posts: 14
  • Karma: +0/-0
    • View Profile
Explosions and animations.
« on: Thu, Oct 7, 2010 »
Hey guys, I've been in the process of making this game for a while now and have been having some issues with the players animations. I've just kept working on other parts of the game hoping I'd come up with a solution eventually but nothing I've tried has done it for me and now I've run into another issue and I felt like I can't just let them keep piling up on me so I'm hoping someone can help me out.

1.When my character shoots using a justPressed "C", he shoots and calls up the shooting animation but the animation only stays on the screen for a split second, it doesn't play out correctly and looks really awkward. Actually I'll just post it on SwfCabin so you can see:

http://www.swfcabin.com/open/1286466649 - this version's shooting animation doesn't finish, and the hurt animation isn't even visible.

http://www.swfcabin.com/open/1286470458 - in this version I add a if(finished) before the animation code. Now shooting on the ground looks right and the hurt animation does too but now everything plays until it's finished and so running and jumping look awkward.

Here's the code:
Code: [Select]
//if (FlxG.keys.justPressed("C")) play("standshoot",true);

//if(finished)
//{

if (velocity.y < 0)play ("jump");
else if (velocity.y > 0) play("fall");

else
{
if(velocity.x != 0) play("run");
else play("idle");
}

//}

if (FlxG.keys.justPressed("C"))
{
play("standshoot");}



That's how the first version is, the second version I just comment out the bottom shoot animation and uncomment the first up top and the if(finished). The hurt animation only works with the second version though the hurt animation is called by my override hurt command. I can't figure out how to make the hurt and shoot look right without breaking my running jumping and idle animations.

Do you think I'm making my sprite too complicated? I haven't even begun to think how I would go about making shooting while running or jumping work if I can't even get this. I'm trying to get it so that he brings up his arm and shoots, has a little recoil and then puts his arm back down kind of like megaman would. He would do the same for running, run normally and then when shooting replace the current running frame with the shooting and running frame for the next two frames (idk something like that, think megaman X)


I'm just hoping that isn't too complex to accomplish, whether it be because of my limitations or flash's. Otherwise I'd probably redo the sprite to be more Metriod like where Samus just always has her gun arm up. That'd probably be tons easier.

Next Issue:
2. In any of those version I posted up there you can see I have the little enemies to explode into bits with the FlxEmitter, that was easy enough, but I also tried to add this explosion (below) I made to pop up on the screen as it dies with the emitter particles flying out behind it. The explosion is also supposed to play a sound but that obviously didn't work out either lol.



ATM I have the explosion as its own class that pops up, plays its animation and sound, then dies. I'm guessing I made a rookie mistake somewhere but I hope this is doable because I rather juts have the explosion be its own class and called up by various enemies than have to go into the other sprites graphics them selves and add an explosion animation for each enemy I made later.

Explosion Class code:
Code: [Select]
package 
{
import org.flixel.*;

public class Boom1 extends FlxSprite
{

[Embed(source = '../lib/Boom2.png')] private var ImgBoom:Class;
[Embed(source = '../lib/SFX/splode1.mp3', mimeType = 'application/octet-stream')] private var SFXBoom:Class;

public function Boom1()
{
super();
loadGraphic(ImgBoom, true, false, 40, 40);
exists = true;
solid = false;
addAnimation("boom", [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11], 15, false);
}
override public function render():void
{
super.render();
}
override public function update():void
{

if (dead) return;

play("boom");
if (finished) super.kill();
super.update();



}
public function Boom(X:int, Y:int):void
{
exists = true;
FlxG.play(SFXBoom, 1, false);
super.reset(X, Y);

}
}

}

and the Enemy that uses it:
Code: [Select]
package 
{
import org.flixel.*;
import PlayState;

public class Goby extends FlxSprite
{
[Embed(source = '../lib/Goby.png')] private var ImgGoby:Class;

[Embed(source = '../lib/gobygibs.png')]private var ImgGibs:Class;


private var player:Player;
private var moveCounter:Number = 5;
private var spotted:Boolean = false;
private var spring:Number = .1;
private var boom:Boom1;

protected var gibs:FlxEmitter;

public function Goby(X:Number, Y:Number, ThePlayer:Player, Gibs:FlxEmitter,Boom:Boom1)
{
super(X, Y);
maxVelocity.x = 50;
maxVelocity.y = 50;
loadGraphic(ImgGoby, true, true, 20, 20);
player = ThePlayer;

gibs = Gibs;
boom = Boom;

gibs = new FlxEmitter();
gibs.delay = 3;
gibs.setXSpeed( -100, 100);
gibs.setYSpeed( -200, 10);
gibs.setRotation( -720, -720);
gibs.createSprites(ImgGibs, 24, 8,true,0)

PlayState.lyrSprites.add(gibs);


drag.x = 45;
drag.y = 45;



width = 12;
height = 12;
offset.x = 3;
offset.y = 3;


health = 3;

addAnimation("idle", [3, 4, 5], 25, true);
addAnimation("moving", [0, 1, 2], 25, true);
}
override public function update():void
{

//unrelated movement code
super.update();
}
override public function kill():void
{
if (dead) return;

super.kill();

gibs.at(this);
gibs.start(true, 2, 10);
PlayState.lyrSprites.add(boom);
boom.Boom(x, y);
}
}

}

idk I probably completely butchered how the Goby handles the Boom or how the Boom itself works. Sorry for the mess.

Also come to think of it is there a better way to add the gibs to the playstate besides PlayState.lyrSprites.add(gibs);? I don't think that's going to work out for me if I make multiple stages or screens with different playstates but if I use FlxG.state.add(gibs) it ends up adding behind everything including the tilemap.

Man sorry for the huge post, I'm really still very much a noob with all this, I'm starting to really feel like I'm getting in over my head. Thanks for your time.

carls

  • Member
  • **
  • Posts: 16
  • Karma: +0/-0
    • View Profile
Re: Explosions and animations.
« Reply #1 on: Thu, Oct 7, 2010 »
kacamac,
I like soo much your game and I want to know if you could help me with some tips.
I'm trying to make a game, but I donīt know how to put a background in it.
I've tried to embedd an png and put it like a FlxSprite. Ouk, it works but I think that's not the better way to do this.
How do you put the orange background in your game?
Thanks for help and keep your game in that way...
Here in flixel forum you can find how to make wall jumping like megaman style

http://flixel.org/forums/index.php?topic=2479.0

=)



kacamac

  • Member
  • **
  • Posts: 14
  • Karma: +0/-0
    • View Profile
Re: Explosions and animations.
« Reply #2 on: Thu, Oct 7, 2010 »
The background is just something I put together with DAME, and then using the CSV file.
Code: [Select]
                [Embed(source = '../lib/tile1.png')] private var tile1:Class;

[Embed(source = '../lib/mapCSV_Group1_Map1.csv', mimeType = 'application/octet-stream')] private var t2:Class;
private var testmap:FlxTilemap;

private static var lyrStage:FlxGroup;

override public function create():void
{

lyrStage = new FlxGroup;

                        testmap = new FlxTilemap;
testmap.drawIndex = 1;
testmap.loadMap( new t2, tile1, 16, 16);
testmap.collideIndex = 222;
lyrStage.add(testmap);

Even though I'm using DAME atm this topic is how I learned how to put the map itself into the game. : http://flixel.org/forums/index.php?topic=211.0

initials

  • Contributor
  • ****
  • Posts: 378
  • Karma: +0/-0
  • Initials
    • View Profile
    • Initials Blog. Code and other things.
Re: Explosions and animations.
« Reply #3 on: Thu, Oct 7, 2010 »
Your pixel sprites are so cool!

In the first part of the code, use an else if state so that it is exclusive.
The problem is that it is playing the shoot animation, then velocity is not equal to 0 so it plays the run animation.
Initials: Super Lemonade Factory, Super Lemonade Factory Part Two, Above The Clouds, Revvolvver, Four Chambers of the Human Heart

kacamac

  • Member
  • **
  • Posts: 14
  • Karma: +0/-0
    • View Profile
Re: Explosions and animations.
« Reply #4 on: Thu, Oct 7, 2010 »
Thanks :)

OK I just spent a good 20-30 minutes swapping out the position of the animations and which one gets the first if and which one is going to be the last one to get the else with the rest getting else if. I'm not getting anything to work. :(

I'm guessing is that even though C is just pressed, at the very next split second the code is run just pressed is false already before the animation finishes and it goes on to the idle animation unless I use that if(finished)but yea, then everything else breaks....  :-\

SysOp

  • Member
  • **
  • Posts: 53
  • Karma: +0/-0
    • View Profile
    • check my kick ass half-life mod!
Re: Explosions and animations.
« Reply #5 on: Sat, Oct 9, 2010 »
Hey mate

What I do to spawn explosions wherever I want to is creating 10 explosions in my playState, and add those into a group. Then, using a Utils class, I grab that group, and using another function (Utils.makeExplosion(x,y)) I pick a member and call a function (appear()). I control the Z order depending of how I add stuff.

Lemme know if you wanna check that out :)
"Hope is not a dream, but a way of making dreams become reality"

kacamac

  • Member
  • **
  • Posts: 14
  • Karma: +0/-0
    • View Profile
Re: Explosions and animations.
« Reply #6 on: Sun, Oct 10, 2010 »
I think I get what you are saying but yeah if you could show me that would be great.   :D

SysOp

  • Member
  • **
  • Posts: 53
  • Karma: +0/-0
    • View Profile
    • check my kick ass half-life mod!
Re: Explosions and animations.
« Reply #7 on: Sun, Oct 10, 2010 »
Ok!  :D

First, the Explosion class. Create a file named Explosion.as and put this into:

Code: [Select]
package com.adamatomic.Mode
{
import org.flixel.*;

public class Explosion extends FlxSprite
{
[Embed(source = "../../../data/explo.png")] private var ImgExplosion:Class;

public function Explosion()
{
super();

loadGraphic(ImgExplosion, true, false, 100, 100);

addAnimation("poof", [0, 1, 2, 3, 4, 5, 7, 8, 9, 10, 11, 12, 13, 6], 50, false);

exists = false;
solid = false;
}

override public function update():void
{
if ( finished)
exists = false;
else
super.update();
}

public function Create(X:int, Y:int, tint:uint, exp_scale:Number, type:int):void
{
super.reset(X -width / 2, Y -height / 2);

color = tint;
scale.x = exp_scale;
scale.y = exp_scale;

play("poof", true);

exists = true;
}
}
}

Then, on Playstate I create my group, using:

Code: [Select]
protected var _explosions:FlxGroup;
Then, in your create() function of Playstate.as, I add the following:
Code: [Select]
_explosions = new FlxGroup();

var i:uint;

for(i = 0; i < Utils.MAX_EXPLOSIONS; i++)
_explosions.add(new Explosion());

Utils.Init( _explosions.members);

add(_explosions);

Then, you must create a file named Utils.as. Make it look more or less like this:
Code: [Select]
package com.adamatomic.Mode
{
import org.flixel.*;

public class Utils
{
static public var MAX_EXPLOSIONS:int = 5;

static protected var _explosions_array:Array;
static protected var _l:uint = 0;
static protected var _h:uint = 0;
static protected var _init:Boolean = false;

static public function Init(Explosions:Array):void
{
_explosions_array = Explosions;

_init = true;
}

static public function makeExplosion(Ent:FlxSprite, tint:uint = 0xffFFFFFF, exp_scale:Number = 1, type:int = 0):void
{
if (!_init) { FlxG.log("WARNING: You must call Utils.Init(...)\nbefore calling any other function!"); return; }

_explosions_array[_l].Create( Ent.x + Ent.width / 2, Ent.y + Ent.height / 2, tint, exp_scale, type );

if (++_l >= _explosions_array.length)
_l = 0;
}

static public function makeExplosionAt(X:int,Y:int, tint:uint = 0xffFFFFFF, exp_scale:Number = 1, type:int = 0):void
{
if (!_init) { FlxG.log("WARNING: You must call Utils.Init(...)\nbefore calling any other function!"); return; }

_explosions_array[_h].Create( X, Y, tint, exp_scale, type );

if (++_h >= _explosions_array.length)
_h = 0;
}
}
}

Presto!

To use it, I call this function wherever I want to:

Quote
Utils.makeExplosion(this, 0xff000000, 0.5, 0);

Good thing about this, is that you only use a predetermined number of explosions, so, no new objects are created each time you call the function. Just picks the next member of your group, makes it visible and calls the animation. The explosion will hide itself when the animation is done ;)

This is the file I was using:



That's all!

Perhaps could sound complicated for just one tiny explosion, but, on my Utils class I init lots of stuff like that, and I use it for lots of definitions and functions :)

Happy coding :)
"Hope is not a dream, but a way of making dreams become reality"

kacamac

  • Member
  • **
  • Posts: 14
  • Karma: +0/-0
    • View Profile
Re: Explosions and animations.
« Reply #8 on: Mon, Oct 11, 2010 »
That was perfect thanks. I guess I could make Utils handle a lot of different things like making enemy projectiles and and such too huh? Pretty damn awesome. Thanks a million SysOp.

SysOp

  • Member
  • **
  • Posts: 53
  • Karma: +0/-0
    • View Profile
    • check my kick ass half-life mod!
Re: Explosions and animations.
« Reply #9 on: Tue, Oct 12, 2010 »
Heh, no probs!

I am not currently using that for handling enemy projectiles (yet), but I use it for shooting some rockets. Dunno if that counts :P

Procedure it's more or less the same, you create a bunch of rockets, grab the members, pass 'em to Utils, create a similar function and presto! Remember to make your group collide using FlxU.overlap for the bullets.
"Hope is not a dream, but a way of making dreams become reality"

OmegaStorm

  • Member
  • **
  • Posts: 36
  • Karma: +0/-0
    • View Profile
    • OmegaStorm Productions
Re: Explosions and animations.
« Reply #10 on: Tue, Oct 12, 2010 »
Very Nice, SysOp. Nice to learn new, overly awesome techniques.

kacamac

  • Member
  • **
  • Posts: 14
  • Karma: +0/-0
    • View Profile
Re: Explosions and animations.
« Reply #11 on: Sat, Oct 16, 2010 »
okay kinda at my wits end with the shooting animation. Is there any way to call a if(finished) to check to see if only say AnimationA, and AnimationB are finished and ignore if AnimationC,D, and E are finished? Otherwise I have no idea how I could get my shooting animation to not be interrupted by the idle animation.