SC2Mapster

This one goes out to Voxglhf, ZenoFrozen and anyone else who wanted to learn how to make a Hero Selection dialog.This tutorial is meant to show you how to create your own simple character selection screen, you are encouraged to change it around and make it unique, not just use what I did, change the character names and call it a day. The final product of this tutorial, given that you have for some reason followed these instructions to the letter, will end up looking like this: nothing too fancy, just a working dialog. Again, it's up to you to make it your own, no stealing now =P

Actual Tutorial Starts Here

So, the first thing that we're gonna do is open up the Galaxy Editor and whip out whatever map you've been working on with heroes and the like. Now open up the trigger editor by selecting the gear-shaped button on the toolbar up top or by pressing the f6 button. Now in the trigger editor, we're going to select the Map Initialization trigger that should already be there (if it isn't for any reason, right-click and select "New - New Trigger" or press ctr-t to make a new trigger. Under events, do the same and create a new event, choose Map Initialization) Now that we're all on the same page here: go to the actions and delete any unnecessary Melee Actions, make sure to read them and make sure that you don't need them of course. Now right click and choose New - Action or press ctr-r to make a new action on the bottom of the list. Choose Create Dialog from the list of functions: keep the dialog Modal, you won't need to use a non-Modal dialog in this tutorial, and choose the size and location that you want the dialog. For our purposes, mine looks like :

Dialog - Create a Modal dialog of size (800, 1000) at (0, 0) relative to Center of screen

Now we're going to want a variable to reference this dialog later, create a new variable in the left-panel, the one that holds the Map Initialization Trigger. Choose type - Dialog from the drop down menu and leave the variable as null: leave it as "No Dialog." I named mine "Character Selection Dialog", but you can name yours whatever. Now back in our Initialization trigger, we're going to create a new action, (always put it below the last unless I say otherwise) choose the Set Variable function from the functions section. Now set the variable that you just made to "Last Created Dialog" and boom! You now have a variable with which to reference your new dialog. Don't worry if you test it out and can't see it, You Must use Show Dialog to actually see what you've done, but we'll get into that in a minute. Now that we've got a shiny new Modal Dialog, we're going to need to slap some buttons in there now aren't we? So to create a new button, we're going to add a new action: Create Dialog Item (Button) for the dialog variable that you just set and fill in the settings, I'll leave it to you to choose your own size, position, tooltip and hover picture (if you want) and text, but an important thing to note is that checking off the Style Controls and Raw Text fields allow you to insert pictures and color your text. Once you are satisfied with the location and look of your button, create another new variable in the left trigger pane next to your dialog variable and set it to type - Dialog Item from the drop down menu on the left. Again, leave the variable itself alone.

Warning: Array AlertYou can skip this section if you do not want to use arrays in your triggers as they can make it more difficult to understand if not properly noted and commented. If, on the other hand, you want to keep the amount of variables that you have to a minimum, go right ahead. You've been warned. Go to where you just created your variable for that last button and check off the array button, then choose size = (however many buttons you will have) - 1. Do NOT enter anything into the second "Size" text area. This will make your array multi-dimensional, something that you DON'T need to worry about during this or likely any other time. Now that your array is set up, anytime you reference your variable you will have to specify the position that you want to set/get from it. ie: myVariable[0 through n] REMEMBER: An array ALWAYS starts at 0, that is the first position in the array. I made an array "Buttons[12] as I needed a total of 13 buttons (13-1=12) and made a comment (right click new - comment or ctr-/) detailing what button was in each position, I highly recommend doing this with an array. Array Warning has passed. Back to normal tutorial

Now that we have our new button variable or array set up, go back into our Map Initialization trigger and add another Set Variable action and set your new variable or array[0] to "Last Created Dialog Item" and voila, instant button referency goodness for when we actually set what happens when you use the button. Now follow the last few steps for creating a new dialog item and variable/array[x] for each character. You can see how it looks and the spacing of each button by adding the Dialog - Show / Hide Dialog and setting it to show your dialog variable at the bottom of the action list *Note: This must always be below all Dialog / Dialog item declarations. Now I've gone ahead and made all of my buttons like so:

Dialog - Create a Modal dialog of size (800, 1000) at (0, 0) relative to Center of screen

Variable - Set Character Select Dialog = (Last created dialog)

Dialog - Create a label for dialog Character Select Dialog with the dimensions (200, 50) anchored to Top with an offset of (0, 50) with the text "Select Your Hero" color set to White text writeout set to false with a writeout duration of 2.0

------- Pilot Hero

Dialog - Create a button for dialog Character Select Dialog with the dimensions (200, 250) anchored to Top Left with an offset of (50, 100) setting the tooltip to "Pilot Hero" with button text "Assets\Textures\wireframe-terran-sc..." and the hover image set to ""

Variable - Set Buttons[0] = (Last created dialog item)

------- Juggernaut Hero

Dialog - Create a button for dialog Character Select Dialog with the dimensions (200, 250) anchored to Top Left with an offset of (300, 100) setting the tooltip to "Juggernaut Hero" with button text "Assets\Textures\wireframe-terran-ma..." and the hover image set to ""

Variable - Set Buttons[1] = (Last created dialog item)

------- Demolitionist

Dialog - Create a button for dialog Character Select Dialog with the dimensions (200, 250) anchored to Top Left with an offset of (550, 100) setting the tooltip to "Demolitionist" with button text "Assets\Textures\wireframe-terran-ma..." and the hover image set to ""

Variable - Set Buttons[2] = (Last created dialog item)

Dialog - Show dialog (Character Select Dialog)

etc...etc... Try to keep the buttons evenly spaced and sized as I have and remember, the button text can include or even BE an image Now that our buttons are all made, they need to actually do something, so now go back over to the left-side trigger pane and let's make a new trigger for button actions. I've called mine Hero Selection, once it's made, make a new event Dialog Item is Used and set it to Any Dialog Item is used by Player Any Player with event type Clicked although it should already be like that. Now we're getting to the actual functioning part: create a new action: If then else and add a condition to the "if" section (ctr-k): Comparison - item 1: "Used Dialog Item" operator: "==" item 2: "Variable" Put your variable corresponding to the first button in the second item position, this will basically check if the clicked button was that variable. Put whatever you want to happen for that button as an action in the "then" portion, don't put anything in the else section, we won't need that for our purposes. Mine looks like this:

General - If (Conditions) then do (Actions) else do (Actions)

If

(Used dialog item) == Buttons[0]

Then

Variable - Set Unit = Scientist [242.20, 234.76]

Else

... ... ...

Dialog - Disable Used Button for (All players)

Unit - Change ownership of Unit to player (Triggering player) and Change Color

Unit - Move Unit instantly to Hero Spawn (No Blend)

Dialog - Hide Character Select Dialog for (Player group((Triggering player)))

What I did was set a local "Unit" variable to be whatever hero that I wanted to use (They are already on the map, me being lazy while making my test map) with the if statement, then after all the if statements finish checking the Used Dialog Item with the variables, I moved "Unit" to my Hero Spawn Point that I created, disabled the button so that nobody else can pick that Hero and hide the dialog for the player who clicked the button. Do this for each button, hero and action until you have covered them all and congrats! You have a working character selection dialog! But...

Extra Credit

That character selection wasn't enough for you skipper? What about that description panel that you saw in the picture (go back and look if you're so inclined). Super! Let's do this! But, fair warning this is going to get a wee bit more complex. So, let's start off by making and setting a new variable for the accept button, it can go in your array as a new position (as long as you increase the size) or it can be a whole new variable, make it a Dialog Item and don't set it, as per usual. You will also need a variable for each section of the description dialog and one for the dialog itself, I have a Dialog variable named popout and a Dialog Item array[2] which will contain Name, image, description. Now go into your trigger that contains all the "If then else" statements and create a local variable to check whether the button clicked was the accept button: make it a Boolean (true / false) and set it to false. Now create an If then Else statement at the very end of your trigger with the condition: Value 1: "Boolean", operator "==", Value 2: "false" and add actions in the "then" section to create a Modal Dialog with dialog items set to each variable, make the sizes that you want and the position that each will be in, then make an accept button. Mine looks like so:

General - If (Conditions) then do (Actions) else do (Actions)

If

Button 12? == false

Then

Dialog - Create a Modal dialog of size (500, 800) at (0, -180) relative to Left of screen

Variable - Set Popout Dialog = (Last created dialog)

Dialog - Create a label for dialog Popout Dialog with the dimensions (200, 50) anchored to Top with an offset of (50, 50) with the text (Text(Popout[0])) color set to White text writeout set to false with a writeout duration of 2.0

Dialog - Create a label for dialog Popout Dialog with the dimensions (200, 400) anchored to Top with an offset of (0, 100) with the text (Text(Popout[1])) color set to White text writeout set to false with a writeout duration of 2.0

Dialog - Create a label for dialog Popout Dialog with the dimensions (400, 500) anchored to Top with an offset of (0, 350) with the text (Text(Popout[2])) color set to White text writeout set to true with a writeout duration of 2.0

Dialog - Create a button for dialog (Last created dialog) with the dimensions (200, 50) anchored to Top with an offset of (0, 700) setting the tooltip to "Accept the chosen hero" with button text "Accept" and the hover image set to ""

Variable - Set Buttons[12] = (Last created dialog item)

Dialog - Show Popout Dialog for Player

Else

Now that will create a dialog with some currently unspecified data each time that someone clicks on a Hero's button. Now to set the data, in the "if" statement for each Hero's button add a few more Set Variables to set the description, image or whatever you wanted to make. Here's ANOTHER example! (I know your probably getting tired of seeing all this)

General - If (Conditions) then do (Actions) else do (Actions)

If

(Used dialog item) == Buttons[9]

Then

Variable - Set Unit = Predator [239.67, 233.49]

Variable - Set Popout[0] = "The Predator"

Variable - Set Popout[1] = "<img path="Assets\Textures\predatorportrait_static.dds"/>"

Variable - Set Popout[2] = "Meet the Predator Mark 5 home defense unit: it slices, it dices, it makes mincemeat out of those pesky neighbor kids. How much would you pay for your families security? How bout 19 easy payments or 1999.99?"

Else

Awesome, so that eats up a lot of time, but the end results are pretty great, now for one final touch. We're going to need to set it so that the accept button makes the hero unit spawn and whatnot. So take the Unit - Create Unit, Disable Dialog Item, Dialog-Hide Dialog and all that jazz used for actually carrying out the actions and copy them into a new If then else AT THE TOP OF YOUR TRIGGER I can't stress that enough, the if statement for checking the accept button MUST BE ABOVE all the others. So slap all those actions in the Accept button "if" and add a Dialog - Show / Hide Dialog to hide the popup dialog as well and set the Boolean variable to true (It IS the accept button now!). Now, for the very last bit to make it function a little better, make a "Used Button" local variable (you'll see in a second) and now, finally, add a Dialog - Destroy Dialog and Set Variable for the "Used Button" variable to the "Used Dialog Item" right AFTER the accept button and before the next (first button) "if." This will remove the popup before making a new one and set a Used Dialog Item variable to disable in the Accept button "if" (You don't want to disable the accept button... ever). Last section of code, promise.

General - If (Conditions) then do (Actions) else do (Actions)

If

(Used dialog item) == Buttons[12]

Then

Dialog - Disable Used Button for (All players)

Unit - Change ownership of Unit to player (Triggering player) and Change Color

Unit - Move Unit instantly to Hero Spawn (No Blend)

Dialog - Hide Character Select Dialog for (Player group((Triggering player)))

Dialog - Hide Popout Dialog for (Player group((Triggering player)))

Variable - Set Button 12? = true

Else

Variable - Set Button 12? = false

Dialog - Destroy Popout Dialog

Variable - Set Used Button = (Used dialog item)

General - If (Conditions) then do (Actions) else do (Actions)

If

(Used dialog item) == Buttons[0]

Then

Congrats! You're done!

If there were some parts of this (very) long tutorial that you didn't quite understand, feel free to take a look at my test map which will much later down the road be used in a special project between RamenNoodles and myself.

@Shinoogie12: Go

I like your sense of humor the character descriptions are greats.

Thanks for the tutorial :D was useful and easy to follow

Nice tutorial, however...what if there are multiple players using the same character screen, how would I make the popout dialog not get destroyed for All Players when someone clicks a different hero?

I have a problem with this part, creating the popout dialog:

Dialog - Create a label for dialog Popout Dialog with the dimensions (200, 50)
anchored to Top with an offset of (50, 50) with the text (Text(Popout[0])) color
set to White text writeout set to false with a writeout duration of 2.0

I don't understand what option you use to get the (Text(Popout[0])) function. I have also got an array for my popout dialog contents, so that isn't the problem; it's just that I can't find this text option.

Edit: I think the problem is that in the tutorial, it says that we're supposed to create a Dialog Item array variable. But actually, I think it should be a String array variable. This way, the information can be recalled with Convert String to Textm which I found out is the option I had problems with above.

well wtf i would relly like to put this inot my map but for some reason i dont have the global source so i can't

"""""Now that we have our new button variable or array set up, go back into our Map Initialization trigger and add another Set Variable action and set your new variable or array[0] to "== Last Created Dialog Item ==" and voila, instant button referency goodness for when we actually set what happens when you use the button. Now follow the last few steps for creating a new dialog item and variable/array[x] for each character. You can see how it looks and the spacing of each button by adding the Dialog - Show / Hide Dialog and setting it to show your dialog variable at the bottom of the action list *Note: This must always be below all Dialog / Dialog item declarations. Now I've gone ahead and made all of my buttons like so:"""""""""""""

Trying your guide now. It's not difficult to do. But for people just starting they might have a little trouble. Just thinking that Screenshots would help. Make things clearer.

But thanks for the tutorial. Helped so much on my RPG map.