Facebook Twitter YouTube Frictional Games | Forum | Privacy Policy | Dev Blog | Dev Wiki | Support | Gametee


Thread Rating:
  • 3 Vote(s) - 3.67 Average
  • 1
  • 2
  • 3
  • 4
  • 5
GUI Tutorial Series
Abion47 Offline
Senior Member

Posts: 369
Threads: 22
Joined: Oct 2015
Reputation: 46
#18
RE: GUI Tutorial Series

She Goes In And Out, And In, And Out...

So far, we've gone through just about all of the basics of creating beautiful, interactive terminals that can do just about anything we can throw at them. But so far, it's been limited to just that - terminals. In real life, computers can do all sorts of things, and not just confined to their own boxes. What if we wanted to make a terminal that controlled other things? In this tutorial, we are going to cover just that.

Table of Contents
The Basics
Getting More Advanced
Using SOMA's Built-In GUI Styles
  • StationGui (WIP)
  • UrbanGui (WIP)
  • Playing Audio (WIP)

Going Beyond Terminals
  • Setting Up a User Module (WIP)
  • Basic Heads-Up Display (WIP)
  • Target Info Module (WIP)
  • Player HUD Menu System (WIP)

Tutorial Requirements

For this tutorial, you will need the following:
  • A map with a prepared terminal.
  • A button prop named "button".
  • A lamp prop named "lamp".
  • A script file with a prepared OnGui terminal callback function.

Tutorial Source Files

Completed File

The Tutorial Itself

As you can see by the requirements, the terminal we will be making for this tutorial will be interacting with a button and a lamp. This will illustrate the two basic concepts of computer interfacing - input and output. Input consists of anything that gives data to the computer, such as a mouse, keyboard, or microphone. Output consists of anything that receives data from a computer, such as speakers, a printer, or a monitor. (Note that some things, like a USB thumb drive, can be both input and output.)

The first thing we will be focusing on is input. Now, there are two ways to provide input to a terminal - reading the data directly, or saving the data to a dummy variable. Reading data directly can be messy, as it depends entirely on what kind of prop you are receiving data from, and it doesn't lead to very readable code. Using a dummy variable, on the other hand, merely requires some form of callback function (which just about every prop has) and allows you to name the variable to describe its purpose.

For example, take a look at the following code snippets:

Reading Directly
void GUITerminal_OnGui(const tString&in asEntityName, float afTimeStep)
{
    // ... Create Label Data
    
    if (Button_IsSwitchedOn("button"))
    {
        ImGui_DoLabelExt("Button pressed", labelData, cVector3f(220, 260, 0));
    }
    else
    {
        ImGui_DoLabelExt("Button not pressed", labelData, cVector3f(220, 260, 0));
    }
}

Dummy Variable

bool mbButtonPressed;

//-------------------------------------------------------

void button_OnConnectionStateChange(const tString &in asEntity, int alState)
{
    if (alState == 1)
    {
        mbButtonPressed = true;
    }
    else
    {
        mbButtonPressed = false;
    }
}

//-------------------------------------------------------

void GUITerminal_OnGui(const tString&in asEntityName, float afTimeStep)
{
    // ... Create Label Data
    
    if (mbButtonPressed)
    {
        ImGui_DoLabelExt("Button pressed", labelData, cVector3f(220, 260, 0));
    }
    else
    {
        ImGui_DoLabelExt("Button not pressed", labelData, cVector3f(220, 260, 0));
    }
}

The second example is quite a bit more verbose, but there's no question as to what it does when looking at it. The first example, despite being much shorter, is also much more ambiguous as to its apparent meaning. (The difference doesn't seem like much in this example, but trust me. When your mod's code gets to be thousands of lines of code long, you're going to appreciate the extra clarity that the second example provides.)

No matter which method you use, however, you can see that receiving input from other entities in your map is simple. The code within your OnGui function doesn't exist in a vacuum, so you can freely call other variables or resources to get any sort of information you want about different things.

In terms of what the code looks like in the game, the two examples produce the same result:

[Image: fKcuxLZ.gif]

Output is a similar process, but it is simpler in that you don't need to worry about dummy variables or recording data or any of that jazz. All it takes is a direct call to whatever object you are trying to output data to. In this case, we are going to use a terminal button to control the lit state of a lamp.

void GUITerminal_OnGui(const tString&in asEntityName, float afTimeStep)
{
    // ... Create Button Data
    
    if (ImGui_DoButtonExt("lamp_button", "Toggle Lamp", buttonData, cVector3f(220, 260, 0), cVector2f(450, 115)))
    {
        if (Lamp_GetLit("lamp"))
        {
            // Turn lamp off
            Lamp_SetLit("lamp", false, true);
        }
        else
        {
            // Turn lamp on
            Lamp_SetLit("lamp", true, true);
        }
    }
}

(The code should be straight forward, but to be clear, what this script does is, whenever the button is pressed, it checks whether the "lamp" entity is currently lit, and turns it off/on correspondingly.)

Running this code in the game gives you something like the following:

[Image: q5eAVIW.gif]

And that's about all you need to know about input and output for SOMA terminals. Using these basics, you can do all sorts of stuff, like using a terminal to open doors, or as a suppliment to a lever-based puzzle, just to name a couple of possibilities.

I hope you are starting to understand just how powerful a tool that terminals can be in your mods. In the next tutorial, we are going to learn a bit more about how to group and organize our ImGui widgets on the screen.

09-03-2016, 08:02 PM
Find


Messages In This Thread
GUI Tutorial Series - by Abion47 - 11-07-2015, 09:27 AM
RE: GUI Tutorial Series - by Abion47 - 11-07-2015, 10:44 AM
RE: GUI Tutorial Series - by Abion47 - 11-07-2015, 11:11 AM
RE: GUI Tutorial Series - by Kanthos - 11-07-2015, 12:38 PM
RE: GUI Tutorial Series - by RaideX - 11-07-2015, 01:28 PM
RE: GUI Tutorial Series - by Abion47 - 11-07-2015, 02:52 PM
RE: GUI Tutorial Series - by Abion47 - 11-08-2015, 03:38 AM
RE: GUI Tutorial Series - by A.M Team - 11-08-2015, 12:46 PM
RE: GUI Tutorial Series - by Abion47 - 11-09-2015, 01:28 AM
RE: GUI Tutorial Series - by Abion47 - 11-09-2015, 02:57 AM
RE: GUI Tutorial Series - by Abion47 - 11-10-2015, 05:06 AM
RE: GUI Tutorial Series - by Vale - 11-10-2015, 08:00 AM
RE: GUI Tutorial Series - by Abion47 - 11-10-2015, 08:03 AM
RE: GUI Tutorial Series - by Abion47 - 11-27-2015, 01:20 AM
RE: GUI Tutorial Series - by Abion47 - 07-12-2016, 07:52 PM
RE: GUI Tutorial Series - by Abion47 - 07-12-2016, 10:04 PM
RE: GUI Tutorial Series - by NewPueblo - 09-03-2016, 12:09 AM
RE: GUI Tutorial Series - by Abion47 - 09-03-2016, 08:02 PM



Users browsing this thread: 2 Guest(s)