How can I load an arbitrary number of images into a GFxMoviePlayer at runtime?

In the Final Fantasy series of video games, you usually have a party of several heroes. In the pause menu, you can see their portraits. For example:

Final Fantasy IX

Final Fantasy XIII

Final Fantasy XII

I would like to make something similar in a GFxMoviePlayer. It wouldn’t be too hard to make a menu like this, within certain limits. I would need 4, 6, and 7 images respectively in the fla’s library. I would make 4, 6, or 7 unique symbols, each one with its own image. And I would replace the images at runtime using SetExternalTexture.

In my own game, a full party could consist of 200 different characters, each with a unique generated portrait. The pause menu can show up to 24 at a time in 4 rows of 6, and I include 6 more portraits offscreen that get used when scrolling through the character list. That’s 30 portraits, each one consisting of several layers of layers of hair, face, and clothing, for a total of 120 images saved in the fla that I replace at runtime.

There has to be a better way to do it.

I would like to start by making each character sheet an instance of the same class. I’d like to instantiate that class and then let each character replace the appropriate texture(s) in their own character sheet. But I don’t think that’s possible. Or if it is, I don’t know how to do it.

You can’t just make each character sheet a copy of the same symbol because each symbol would share the same image file. When you update that one image using SetExternalTexture, it would change the portrait in each character sheet.

Is it possible to save the character sheet as its own fla and swf, import the swf into UE3, open multiple copies of it inside another movie, and have each one populate its own textures independently from the others?

If i understand your requirements correctly, yes this is entirely possible to have a separate swf and import them to another swf at runtime.

Take a look at “Import for runtime sharing” here: UDK | ScaleformImport

Another way to do this is to just store the character images in UDK and pass them as required to scaleform and render them using UILoader. I use UILoader to render my multiplayer player list to display the Steam avatar images. Basically these images don’t need to be baked into your swf (which can make publishing it super slow).

Thanks @Coldscooter I’m making progress with UILoader.

While we’re on the topic, have you ever had this problem? When I have multiple instances of the same movie running, and I change some images in the movies using SetExternalTexture, all of the movies end up using the same texture. It seems if I use SetExternalTexture with the same texture name, on different movies, during the same tick, they all use the same texture. I have to load the textures into the separate movies on separate ticks. I’m wondering if this is a known issue and if so, if there’s another way to fix it.

Also, I think I discovered a bug in Scaleform. I’ll address that in a different post.

I think i remember having a similar issue. It was because I was passing a global reference to the Texture2D, and was overwriting that in memory on subsequent calls.

Try using an array to store the Texture2D instances.

Then use something like this to generate the source url to pass to UILoader:

simulated function String GetImgSourcePath(Texture2D img)
	if (img != none) {
		return "img://" $ img.GetPackageName() $ "." $ img.Name;
	return "";