Game Development Community

dev|Pro Game Development Curriculum

Animated Menus using guiAnimatedBitmapCtrl

by Robert Brower · 03/25/2005 (1:11 pm) · 10 comments

Download Code File

1. Copy engine/gui/guianimatedbitmapctrl.h and engine/gui/guianimatedbitmapctrl.cc to your engine/gui folder.
Add these two files to your Torque Demo project and rebuild your entire solution.

2. Copy the folder example\starter.fps\client\ui\mainmenu and all of it's contents to your
example\starter.fps\client\ui\ folder.

3. Copy example\starter.fps\client\ui\mainMenuGui.gui over your example\starter.fps\client\ui\mainMenuGui.gui
file. ***Note... Be careful not to overwrite any changes you may have made to this file. If you've made
your own changes before implimenting this resource, then merge my changes in with yours.

4. Add example\starter.fps\client\scripts\mainMenuGui.cs to your example\starter.fps\client\scripts\ folder.

5. Copy example\starter.fps\client\init.cs to over your example\starter.fps\client\init.cs file.
***Note... Be careful not to overwrite any changes you may have made to this file. If you've made
your own changes before implimenting this resource, then merge my changes in with yours.

6. Copy example\starter.fps\data\sound\mainmenu.ogg to your example\starter.fps\data\sound folder.

Notes:

I added a couple of members to guiAnimatedBitmapCtrl to allow it to be reset, and allow you to make it
hold at the beginning. I added a script callback that gets called when the animation is done playing.

I tested this resource on a fresh Torque Game Engine 1.3.

The file mainmenu.ogg is not a legal sound file. You may not use it in your released product.

Good luck and Enjoy!

Robert

#1
03/25/2005 (3:03 pm)
Thank you - much appreciated!
#2
03/25/2005 (3:46 pm)
Works great, thanks Robert :)

Instead of setting it to a bitmap with the buttons cut out at the end, and then overlaying button controls, you can leave the button image as part of the menu, and just put invisible buttons overtop by using a fully transparent png.

You loose the button effects (mouse over, etc) but ends up being a bit cleaner and works better with relative positioning since you dont end up with thin lines around the button images where the buttons and menu weren't scaled exactly the same.
#3
03/25/2005 (4:14 pm)
Matthew: Great Idea! Thanks!

Robert
#4
04/02/2005 (4:47 am)
Hi Robert,

Works great.. thnx

Ali Shikla
#5
04/28/2005 (6:15 pm)
Thanks Robert,

But New problem happen to me!

Somewhat 'Tearing'image during animation!

How to overcome this problem.

Pls Help!

Peter
#6
10/17/2005 (8:46 pm)
wow i can't for the life of me figure out how to loop this thing.....
#7
07/14/2007 (10:57 am)
Installed just fine on 1.5.2
#8
07/15/2007 (1:37 pm)
On the looping question I ran into a similar issue where I tryed to reset and play the animation again after it ended. . . didn't work. To fix this I added a new option to the control "loop" this is a bool where when true the animation will loop.

Code follows,

in guiAnimatedBitmapCtrl.h add

bool mLooping;

add that just below

protected:
   bool mIs3d;

now in guiAnimatedBitmapCtrl.cc we replace

// RFB -> don't cycle back to the first image
mIndex = mMaxBitmaps - 1;

with this code

//DSG modifacation looping option
 if(mLooping) //if we are set to loop adjust index to start
	mIndex = 0;
	else// RFB -> don't cycle back to the first image
             mIndex = mMaxBitmaps - 1;

Also back up toward the top of the .cc we need to add

addField("Loop", TypeBool, Offset(mLooping,GuiAnimatedBitmapCtrl));

to the
void GuiAnimatedBitmapCtrl::initPersistFields()
function

and we also need to add

mLooping = false;

to the
GuiAnimatedBitmapCtrl::GuiAnimatedBitmapCtrl(void)
function

What this will do is add a new bool option to the ctrl which will default to false, if set to true it will ofcourse loop endlessly.

Thanks again for the reasource, vary useful and easy to implement.
#9
07/16/2007 (5:16 am)
On the subject mentioned by Matt Mitman, couldn't we get the same effect by setting the last image to be solid (no text) then drawing our buttons over top of this where the button is mostly transparent less the text and the highlight effect. This way we can keep the heighlight effect but dont have to wory about the buttons and animation ctrl scaling exsactly the same.

an example

1) fill in the holes in the last image
2) make new buttons which are only text with a transparent background, name them the same as the originals

That should be it, we could go a step further to insure there is no major diffrence in the last animation and the final image by removing all text from the animation this would give the effect of the menu animating to open once fully open buttons would apear. Just a thought. . .
#10
10/17/2007 (5:28 am)
Im using this great resource, it work pretty well, but it has a draw back for me, it dont have a good cache or a preload for the images that it use, when i ask the control to use a new DML, it normally takes something about 1-2 secs to play, which is pretty annoying in some cases, and in another is even worse. I didnt tried to implement this things yet, but would pretty good to have this controller with this functions.