ScaleForm: Making a Menu with Components + Camera Animation

[Allar]

Re-post from my blog post here (http://forecourse.com/2010/06/making-a-menu-scaleform-tutorial-series/).

Hello thar! ScaleForm tutorials seem to be the latest craze so I've decided to make a series in regards to making a menu in ScaleForm.

http://www.forecourse.com/unreal/MenuExample.jpg

You can view the final result of this series here. (http://www.youtube.com/watch?v=ep-7AfAH3xM)

There are two sets of videos depending on your skill with flash, if you are new to flash check out this series:

Part 1: Making a Menu: Setting Up ScaleForm for Flash (http://www.youtube.com/watch?v=MvjfTBJ96z4&feature=PlayList&p=4654EC463346F823&playnext_from=PL&index=0&playnext=1)
Part 2: Making a Menu: Installing ForecourseUI for ScaleForm and UDK (http://www.youtube.com/watch#!v=u1DOpdtf-2s&feature=PlayList&p=4654EC463346F823&playnext_from=PL&playnext=1)
Part 3: Making a Menu: Scaleform + Forecourse UI Components Part 1 (http://www.youtube.com/watch#!v=HbVyQCmp8ZE&feature=PlayList&p=4654EC463346F823&playnext_from=PL&playnext=1)
Part 4: Making a Menu: Scaleform + Forecourse UI Components Part 2 (http://www.youtube.com/watch#!v=OH99DmwZ1W4&feature=PlayList&p=4654EC463346F823&playnext_from=PL&playnext=1)
Part 5: Making a Menu: Adding Button Functionality (http://www.youtube.com/watch#!v=ug6hReYX1Rc&feature=PlayList&p=4654EC463346F823&playnext_from=PL&playnext=1)
Part 6: Making a Menu: Adding Button Functionality Part 2 (http://www.youtube.com/watch?v=feCuGyhOxRE&feature=PlayList&p=4654EC463346F823&playnext_from=PL&index=1)
Part 7: Making a Menu: Basic Kismet Integration (http://www.youtube.com/watch#!v=ZbJc7RvxZxs&feature=PlayList&p=4654EC463346F823&playnext_from=PL&playnext=2)
Part 8: Making a Menu: FSCommands + Animating the Camera (http://www.youtube.com/watch#!v=FycjRtaW5_I&feature=PlayList&p=4654EC463346F823&playnext_from=PL)
Part 9: Making a Menu: Kismet + ForecourseUI Camera Helper (http://www.youtube.com/watch?v=aQ4MkfWtgSc)
Part 10: Making a Menu: Adding a Cursor (http://www.youtube.com/watch?v=6VkP7JgYH4k)
Part 11: Making a Menu: Finished! Heres Some More Info (http://www.youtube.com/watch?v=kJaLn2_J0iI)

If you are already experienced with Flash and have ScaleForm installed, or only want to spend 30 minutes learning how to do this, follow this shorter series:

Part 1: Making A Menu: Installing ForecourseUI for ScaleForm and UDK (http://www.youtube.com/watch?v=u1DOpdtf-2s) -- 6 Minutes
Part 2: Making A Menu: Fast: Building the Flash Menu Part 1 (http://www.youtube.com/watch?v=jHLxb1l36yU) -- 8 Minutes
Part 3: Making A Menu: Fast: Building the Flash Menu Part 2 (http://www.youtube.com/watch?v=wUVKHzNnwR0) -- 3 Minutes
Part 4: Making A Menu: Fast: Integration with Unreal (http://www.youtube.com/watch?v=mr1W7XtWMfU) (Still Uploading) -- 9 Minutes

Link to ForecourseUI Download: http://forecourse.com/udk-development/

Note: For some reason my youtube playlist has things a bit out of order but I re-ordered the videos... I suppose it takes time for it to update that I suppose.

[Zomy]

Nice to see this ;).
One problem, i can't open Dynamicmenu.fla :(. I have Flash CS3 Professional.

[Masakari]

Nice, thanks for making and posting them!

[kon_nos]

Nice tutorial. I'm getting an error though.
In Making a Menu: Scaleform + Forecourse UI Components Part 2 (http://www.youtube.com/watch?v=OH99DmwZ1W4) when you Test with FxMediaPlayer the command line says

Error: CallMethod - can't find method _level10.DMHolder_mc.BindMenu (x2)
Error: CallMethod - can't find method _level10.DMHolder_mc.SwitchToMenu
and I can't see anything.
I also get 3 compiler errors

The class or interface 'com.forecourse.DynamicMenu' could not be loaded.
The class or interface 'com.forecourse.DynamicMenuholder' could not be loaded.
The class or interface 'gfx.controls.Button' could not be loaded.

Have I messed everything up??

[Allar]

Looks like you don't have the ForecourseUI AND the ScaleForm includes set up right.

In Flash you need to go to Edit->Preferences and set up the ActionScript 2.0 Settings box as per Part 1 and Part 2.

[kon_nos]

I was pretty sure I did that, but you are right. I sound like a noob :(.
Thanks for the instant answer.

[Allar]

You probably did, which version of Flash are you using?

[kon_nos]

Adobe Flash Professional CS5 that is. Think it was a bug?

[Allar]

In the videos, my cs5 crashes in that box sometimes and doesn't save settings half the time. Pesky cs5. Never had a problem with that in cs4 though.

[Zomy]

Hey Allar, any idea about my error?

[Allar]

Doh, didn't see that last sentence thar.

Yeah, my files are only cs4+ compatible D:

I'll hit up a place with Flash 8 and make a version thats compatible with earlier versions as soon as I can.

[Lajah]

Hello,

The Tutorial are very good. But I have one Problem, my Buttons are to high in the screen. What I have done wrong??

Here is a link to a screen from the Problem:
http://www.bilder-hochladen.net/files/cf89-5-jpg.html

And I have a Problem by the Resolution. I see the Button with the Text "Resolution", but I don´t see the Numbers (for example 1024*726)

her is the code:

import com.forecourse.SettingsManager;

var settingsManager:SettingsManager = new SettingsManager();

settingsManager,Resolution_txt = DMHolder_mc.GetButtonMC("Einstellungen","Auflösung").textField;

settingsManager.UpdateResolutionText();

Sorry for my bad english but I´m from Austria and never tak in english :-))

[rvc]

I'm having this error:

Load: _level0.DMHolder_mc
Load: _level0.MainMenu_mc
Load: _level0.Settings_mc
Load: _level0.MainMenu_mc.New Game_mc
Load: _level0.MainMenu_mc.Settings_mc
Load: _level0.MainMenu_mc.Exit_mc
Load: _level0.Settings_mc.Resolution_mc
Load: _level0.Settings_mc.Save Settings_mc
Load: _level0.Settings_mc.Exit_mc
Error: CallMethod - 'substr' on invalid object. (x2)

here's the actionscript

DMHolder_mc.BindMenu("MainMenu");
DMHolder_mc.BindMenu("Settings");
DMHolder_mc.SwitchToMenu("MainMenu");

DMHolder_mc.HandlePress = function(pressName:String)
{
switch(pressName)
{
case "New Game":
break;

case "Settings":
DMHolder_mc.SwitchToMenu("Settings");
break;
}
}


Also, I'm on CS5, I've set the flash player version to 8 and AScript to 2.0.

I'm pretty sure I wrote everything else exactly the same as you did so... don't get it :S

[krashner]

Hello,

The Tutorial are very good. But I have one Problem, my Buttons are to high in the screen. What I have done wrong??

Here is a link to a screen from the Problem:
http://www.bilder-hochladen.net/files/cf89-5-jpg.html

And I have a Problem by the Resolution. I see the Button with the Text "Resolution", but I don´t see the Numbers (for example 1024*726)

Sorry for my bad english but I´m from Austria and never tak in english :-))

On "settingsManager,Resolution_txt" you have a comma instead of a period

[Allar]

On "settingsManager,Resolution_txt" you have a comma instead of a period

Thanks for helpin' me help others! :D

[Ordo]

Hey Allar,

Not sure if you know, but, I'm at part 3 and whenever I try to launch the ScaleForm test with the placeholder thingy, I get this error:
The following JavaScript error(s) occurred:

SyntaxError: missing ) after argument list

I tried googling it, but I only got results for Dreamweaver(and a Java error site, but apparently said error wasn't listed), where the victims were told to delete their Java cache, so I'm kind of stumped about this. You've made great tutorials though(not just ScaleForm ones)! Four thumbs up.

[Nysuatro]

This will help me for my current project. Thanks for the share.

[Allar]

Hey Allar,

SyntaxError: missing ) after argument list


Some where in your code, its like...

Something(onething,otherthing,blah

where it should be

Something(onething,otherthing,blah)

:D

[Ordo]

My question is: what code?
The Frontend compiler found no oddities and I looked through my own projects code myself, line-by-line.

[tegleg]

thanks allar
good stuff! those components are well handy :)

just one question
is the code from the video in text form anywhere?
im wasting hours squinting at crappy youtube vids trying to copy the code down right

[KayoticSully]

I'm having this error:

Load: _level0.DMHolder_mc
Load: _level0.MainMenu_mc
Load: _level0.Settings_mc
Load: _level0.MainMenu_mc.New Game_mc
Load: _level0.MainMenu_mc.Settings_mc
Load: _level0.MainMenu_mc.Exit_mc
Load: _level0.Settings_mc.Resolution_mc
Load: _level0.Settings_mc.Save Settings_mc
Load: _level0.Settings_mc.Exit_mc
Error: CallMethod - 'substr' on invalid object. (x2)

here's the actionscript

DMHolder_mc.BindMenu("MainMenu");
DMHolder_mc.BindMenu("Settings");
DMHolder_mc.SwitchToMenu("MainMenu");

DMHolder_mc.HandlePress = function(pressName:String)
{
switch(pressName)
{
case "New Game":
break;

case "Settings":
DMHolder_mc.SwitchToMenu("Settings");
break;
}
}


Also, I'm on CS5, I've set the flash player version to 8 and AScript to 2.0.

I'm pretty sure I wrote everything else exactly the same as you did so... don't get it :S


I am getting the exact same error. I have looked through as much of the code as I could, but I can not seem to track down the source of the error.

Any help would be greatly appreciated.

[xatrius73]

I am getting the exact same error. I have looked through as much of the code as I could, but I can not seem to track down the source of the error.

Any help would be greatly appreciated.

Exactly the same error!

Please anyone help us!

[isack55]

I am having the same error with substr as these guys. Looks like something either broke or we are all just having the same silly error. Any help would be greatly appreciated.

EDIT: so far, I have narrowed it down to this particular part of the code:


DMHolder_mc.HandlePress = function(pressName:String)

It seems as thought the HandlePress return value has been changed since he made the tutorial. I'm sure if I look hard enough, I can find the code that states the return value, but I haven't figure it out yet. Not that familiar with actionscript either, I'm afraid (C++/Java though :/). So if anyone knows at least where/how I can find the code, please tell me.

[ID_Busy]

In Making a Menu: Scaleform + Forecourse UI Components Part 2 when you Test with FxMediaPlayer the command line says
Error: CallMethod - can't find method _level10.DMHolder_mc.BindMenu (x2)
Error: CallMethod - can't find method _level10.DMHolder_mc.SwitchToMenu
and I can't see anything.

Please Help. I have november udk

[roosterMAP]

I've tried the tut 3 times, and even in the earlyest stages of the tut, when u test with FxMediaPlayer for the first time, it still has errors in the compiler errors tab:

The class or interface 'com.fourecourse.DynamicMenu' could not be loaded.
The class or interface 'com.forecourse.DynamicMenuHolder' could not be loaded.
The class or interface 'gfx.controles.Button' could not me loaded.

[ankangronto]

The problem is that its very outdated. The button.as is alot different now from when he made his. I should have checked the date for this tutorial before I tried it.

[CommanderXG]

Ive just used this tutorial, and it worked... used CS5, and UDK version 8916 with the latest download from forecourse.
The only problem is, when i customized my buttons, my Resolution button changed slightly, and somehow, it has the name and part of the fontname too. "ResolutiontheDark 640x"... then it gets cut off... everything else is working...

[ThePriest909]

Has anyone gotten this to work with any of the 2012 UDK versions? I keep getting this kind of errors when using the Player.

Symbol=Dynamic Menu, layer=Layer 1, frame=1, Line 1 The class or interface 'com.forecourse.DynamicMenu' could not be loaded.

[collix]

What version of Actionscript are you using?
I think the one used here is Actionscript 2 and the current version of Scaleform in UDK uses Actionscript 3, so it's probably not going to work at all...

[ThePriest909]

What version of Actionscript are you using?
I think the one used here is Actionscript 2 and the current version of Scaleform in UDK uses Actionscript 3, so it's probably not going to work at all...

Thanks for replying. Isn't scaleform still supporting AS2 as well?

[sm_12]

i caNT access these videos.. have they been removed..?/