Unity3D/C#: Scripting Keyboard Controlled UI

Because I’ve not posted much for the past few days I thought I’d make it up with a small tutorial.

In DBP I’ve always used keyboard controlled menus as they’re useful in turn-based RPG’s . This little tutorial is just to show that concept put into Unity3D as most GUI tutorials tend to be centered around Unity’s ‘GUI.Button’ class. I never used GUI buttons in DBP. Although my latest GUI system uses an image and changes its position and to be fair this method is fairly flexible, but I’ve done something pretty simple for this. I may show how you might use an image at a later date.

This is the result:

You’ll need to create a new C# script, perhaps call it ‘Interface.cs”

For declarations, lets start with the public variables:

public GUISkin Skin;
public float GUIposX = 10f;
public float GUIposY = 10f;

Because Unity3D’s GUI system uses a user-defined skin you just need to declare a public GUISkin where they can drag in their skin.

GUIposX and GUIpoxY are just so you can choose where you’re going to stick this from within the editor.

For private variables:

private int selection = 1;
private int max = 3;

I use a variable to check which selection has been made. The default will be ‘1’, the first selection, AKA, ‘Attack’.

max will be used to clamp how many selections can be chosen. We have 3, ‘Attack’, ‘Bushido’ and ‘Items’.

For any GUI operations you need to use a Monobehaviour, which is something Unity3D has its own procedures for calling. So any methods you create using the names of ‘Monobehaviours’ like ‘Update()’, ‘Awake()’ and so on, you do not have to call these methods yourself. Unity3D will interpret them for you. In the case of using a GUI Unity3D has ‘OnGUI()’, so we just have to make a method for OnGUI as we’re going to do it. It’s written exactly as if you were to create your own new method.

void OnGUI()

{

}

Very simple. All you need to do now is include any GUI information inside of those 2 curly braces.

The first thing you should do is apply the GUI Skin the user has chosen:

GUI.skin = Skin;

Then we create GUI behaviour for each selection, so we do an if-then statement for each.

if (selection == 1)
{
//GUI.color(
GUI.Label(new Rect(100, 100, 100, 100), “Attack<-“);
GUI.Label(new Rect(100, 110, 100, 100), “Bushido”);
GUI.Label(new Rect(100, 120, 100, 100), “Items”);
}

if (selection == 2)
{
//GUI.color(
GUI.Label(new Rect(100, 100, 100, 100), “Attack”);
GUI.Label(new Rect(100, 110, 100, 100), “Bushido<-“);
GUI.Label(new Rect(100, 120, 100, 100), “Items”);
}

if (selection == 3)
{
//GUI.color(
GUI.Label(new Rect(100, 100, 100, 100), “Attack”);
GUI.Label(new Rect(100, 110, 100, 100), “Bushido”);
GUI.Label(new Rect(100, 120, 100, 100), “Items<-“);
}

That’s all that needs to be done for updating the GUI. Now we need some input to change the selection, before we can do that we need to edit some controls in Unity’s settings. So jump into here:

Basically with any Unity3D project the player will be able to customise their controls and we can set these up inside of the editor. So instead of using commands like “If upkey() = 1” like you may in DBP, you can point directly to a variable to store what could be the ‘Upkey’ but it could also be anything else if the player so decides.

We’ll be using the ‘up’ and ‘down’ arrow keys. They’re already defined for the player control input, we’ll need to just make sure they’re WASD. You just need to replace the key inputs for ‘horizontal’ and ‘vertical’.

Next, there’s 3 ‘Fire’ keys at the bottom that are separate from the main 3 fire keys. Now, we can just renamed them and reassign them to the up and down arrow keys. The labels we use for our input settings are the ones we’ll be using in code. In the ‘positive button’ box all you need to do is type ‘up’ and ‘down’ to point to these keys.

Now you can jump back into your code and use the Mono Behaviour called ‘Update()’. In input is very simple:

if (Input.GetButtonDown(“InputDown”))
{
selection += 1;
}

if (Input.GetButtonDown(“InputUp”))
{
selection -= 1;
}

If the player activates the control ‘InputDown’ then you increment the selection.

If the player activate the control ‘InputUp’ then you decrement the selection.

In DBP the equivalent is:

If upkey() = 1 then dec selection, 1 : if downkey() = 1 then inc selection, 1

There is one last thing this method needs, a clamp to stop the input from over doing itself. In something like Dark Basic Pro you’d have to create a couple of if-then statements, but Unity3D comes with a class called ‘Mathf’, which are a selection of maths methods. One of the methods is ‘Clamp’ and because it returns a value, you just need to assign it to the selection variable.

selection = Mathf.Clamp(selection, 1, max);

You can see why we created ‘max’. Basically what this does is takes the variable: ‘selection’ and check if it is less than ‘1’ (lowest value) or is higher than max (highest value) and if so it’ll return the highest or lowest value back into the variable ‘selection’.

In DBP, this would be:

if selection > max then selection = max

if selection < 1 then selection = 1

In fact, if DBP users wanted their own Clamp function it’s very simple to do:

function MathClamp(var, minim, maxim)

if var < min then var = minim
if var > max then var = maxim

endfunction var

So you’d just type: selection = MathClamp(selection, 1, max) in DBP. Easy as pie.

And that’s it! Just compile and then attach this script to your MainCamera object and it’ll work.

Or if you’d prefer copying and pasting, here is the full source:

using UnityEngine;
using System.Collections;

public class guiInput : MonoBehaviour
{
public GUISkin Skin;
public float GUIposX = 10f;
public float GUIposY = 10f;

private int selection = 1;
private int max = 3;

// Use this for initialization
void OnGUI()
{
GUI.skin = Skin;

if (selection == 1)
{
//GUI.color(
GUI.Label(new Rect(100, 100, 100, 100), “Attack<-“);
GUI.Label(new Rect(100, 110, 100, 100), “Bushido”);
GUI.Label(new Rect(100, 120, 100, 100), “Items”);
}

if (selection == 2)
{
//GUI.color(
GUI.Label(new Rect(100, 100, 100, 100), “Attack”);
GUI.Label(new Rect(100, 110, 100, 100), “Bushido<-“);
GUI.Label(new Rect(100, 120, 100, 100), “Items”);
}

if (selection == 3)
{
//GUI.color(
GUI.Label(new Rect(100, 100, 100, 100), “Attack”);
GUI.Label(new Rect(100, 110, 100, 100), “Bushido”);
GUI.Label(new Rect(100, 120, 100, 100), “Items<-“);
}

}

// Update is called once per frame
void Update()
{
if (Input.GetButtonDown(“InputDown”))
{
selection += 1;
}

if (Input.GetButtonDown(“InputUp”))
{
selection -= 1;

}
selection = Mathf.Clamp(selection, 1, max);

}
}

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s