UDN
Search public documentation:

SettingUpScaleformGFx
日本語訳
中国翻译
한국어

Interested in the Unreal Engine?
Visit the Unreal Technology site.

Looking for jobs and company info?
Check out the Epic games site.

Questions about support via UDN?
Contact the UDN Staff

UE3 Home > User Interfaces & HUDs > Scaleform GFx > Setting Up Scaleform GFx

Setting Up Scaleform GFx


Scaleform GFx Launcher


The Scaleform GFx Launcher is a tool provided by Scaleform to allow flash movies to be previewed in an environment that more closely matches that of an actual game than Flash's standard player.

Installing Scaleform GFx Launcher

Installing the Scaleform GFx launcher for Unreal Engine 3 development follows the standard process:

  1. In Adobe Flash Professional, go to Help > Manage Extensions to run the Adobe Extension Manager.
  2. At the top-right of the Launcher, click the Install button.
  3. In the file browser that opens, navigate to [UE3Directory]\Binaries\GFx\CLIK Tools. and choose the Scaleform CLIK.mxp file.
  4. You will need to agree to the license on the dialog that opens.
    license_agree.jpg
  5. A dialog will then appear showing the installation was successful.
    install_success.jpg
  6. The Scaleform GFx Launcher is now displayed in the Adobe Extension Manager dialog.
    gfx_launcher_installed.jpg
  7. Restart Adobe Flash Professional CS4, close Extension Manager.
  8. Navigate to Window > Other Panels, choose Scaleform Launcher.
    gfx_launcher_menu.jpg
  9. The Scaleform Launcher panel is now displayed.
    gfx_launcher.jpg

Setting up Scaleform GFx Launcher

The Scaleform Launcher needs to be set up to point to the GFx player, so CLIK widgets and their functionality is accessible to preview within Adobe Flash Professional.

  1. Click the add_button.jpg button to add a new Profile.
    profile_new.jpg
  2. The GFx player needs to be referenced. Click the add_button.jpg button to add a player.
  3. Navigate to [UE3Directory]\Binaries\GFx.
  4. Select FxMediaPlayer.exe. NOTE: if you're warned the scripts are running slowly, choose NO. This is a known issue, and Scaleform is fixing it in a future release.
  5. Name the player FxMediaPlayer.
    gfx_player_name.jpg
  6. You can name the profile using the Profile Name field.

Note: The default Adobe Flash Professional renderer will stay intact, to preview the SWF from the GFxPlayer, you need to press the big "Test with ..." button on the Scaleform Launcher panel.

gfx_launcher_profile.jpg

You can also create another profile, that uses the FxMediaPlayerNoDebug.exe player if you wish. This player will not report loading of instances in the console, and will instead only spit out trace commands within your ActionScript.

Setting Up Additional Profiles For Split Screen Previewing

To accurately test the UI's positioning and scaling for standard definition, and split screen screen resolutions, you can set up multiple profiles based on the previous steps to have the GFx Player preview window start at a specific resolution.

  1. Once you have a player set up, in the Scaleform Launcher panel click the add_button.jpg button.
  2. Name the profile SD.
  3. In the command params text field, after %SWF PATH% add the text -res 960:720.
  4. Click OK to save.
  5. NOTE After you hit Launch, the movie will be scaled to fit the view port. Press Ctrl + D on the keyboard to make it fill the player.

Installing CLIK library


ActionScript 2 / Scaleform 3

  1. Within Adobe Flash Professional CS4, go to Edit > Preferences.
  2. Choose ActionScript.
  3. Click the as2_settings_button.jpg button.
  4. Add a new entry with the plus_button.jpg button.
  5. Set path to the CLIK directory (for example: [UE3Directory]\Development\Flash\AS2\CLIK).
  6. ALERT! Make sure that the path you added is second from the top (see image below)!

as2_settings.jpg

ActionScript 3 / Scaleform 4

  1. Within Adobe Flash Professional CS5.5, go to Edit > Preferences.
  2. Choose ActionScript.
  3. Click the as3_settings_button.jpg button.
  4. Add a new entry with the plus_button.jpg button in the Source path section.
  5. Set path to the CLIK directory (for example: [UE3Directory]\Development\Flash\AS3\CLIK) - see below.

as3_settings.jpg

Coding Environments


In addition to the built-in Flash ActionScript editor, there are other coding environments that can be used. A couple are listed below: