> For the complete documentation index, see [llms.txt](https://freedom-developer.gitbook.io/the-chess/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://freedom-developer.gitbook.io/the-chess/the-uis/ui-events.md).

# UI Events

To understand more about the UI system, here is a simple demonstration of how to create a working button.&#x20;

Step 1 :&#x20;

Create an empty scene with any name of your liking and open the scene.

Step 2 : Adding necessary scene game objects for this exercise.

Go to the Prefabs folder inside path UIs/Essential and drag ChessGameObjectBase prefab into the scene hierachy.

<figure><img src="/files/JsaNYN1mEDbOm7hcXZz4" alt=""><figcaption></figcaption></figure>

Then, create a canvas on the scene and go to another folder inside Prefabs folder UIs/Buttons/Base, drag the ResponsiveButton prefab to the screen canvas.

<figure><img src="/files/04F6a0zRbYULwPOX6Ihi" alt=""><figcaption></figcaption></figure>

Scene result as below image

<figure><img src="/files/DTlecuEg0nISaF532sJx" alt=""><figcaption></figcaption></figure>

Step 3 :&#x20;

Copy code below to ChessEventManager.cs located in Scripts/Main/Communicators folder, the string parameter is optional, it's just there to showcase the possibilities of passing parameters values.

```
    public delegate void OnButtonDelegate(string text);
    public static event OnButtonDelegate OnButtonEvent;

    public static void InvokeButtonEvent(string text)
    {
        OnButtonEvent?.Invoke(text);
    }
```

Step 4 :&#x20;

Create a C# script in the path Scripts/Main/UIs/Buttons name DummyButton.cs and copy the code below into it. As soon as the button is clicked, it will invoke the OnButtonEvent event, nothing will happen for now since nothing is listening to this event.

<pre><code>namespace TheChess
{
<strong>    public class DummyButton : ResponsiveButton
</strong>    {
        protected override void StartListening()
        {
            btn.onClick.AddListener(delegate
            {
                ChessEventManager.InvokeButtonEvent("Dummy button clicked");
            });
        }
    }
}
</code></pre>

Step 5 :&#x20;

Remove the ResponsiveButton(Script) component from the scene gameobject and add the newly created DummyButton script to it. Drag the text gameobject to the objectfield.

<figure><img src="/files/pT4wKtn8kl8HgYmgQ8QP" alt=""><figcaption></figcaption></figure>

Step 6 : This is where when button clicked, ChessBaseGUI class will respond.

Open ChessBaseGUI script file in Scripts/Main/GUIs folder and copy below function into it

```
    void DummyButtonCall(string text)
    {
        Debug.Log(text);
    }
```

Then add below line of code into `SubscribeChessEvents()` function, it means ChessBaseGUI will start listening to when button invoke OnButtonEvent, DummyButtonCall function will get called.&#x20;

```
    ChessEventManager.OnButtonEvent += DummyButtonCall;
```

<figure><img src="/files/lDLwxgZjSFJeFlvwYHOa" alt=""><figcaption></figcaption></figure>

It is also important to add a same line of code as previous line but with -= operator to `UnsubscribeChessEvents()` function, to ensure ChessBaseGUI stop listening when exiting scene.

```
        ChessEventManager.OnButtonEvent -= DummyButtonCall;
```

Step 7 :&#x20;

Play and click the button

<figure><img src="/files/LXBaJMi6ujtb44oz7d43" alt=""><figcaption></figcaption></figure>

:thumbsup:Well done, you can now make the button a variant prefab and drag it to any scene that has gameobject with attached script component ChessBaseGUI or GUIs inherited from ChessBaseGUI and it will work straight away.

Step 8 : Optional

To make the button provide feedback if the click did indeed trigger action. Do the following changes.

Replace the InvokeButtonEvent function in Step 3 to code below

```
    public static void InvokeButtonEvent(string text)
    {
        bool? success = OnButtonEvent?.Invoke(text);

        if (success != null)
            CreateButtonRespond((bool)success);
        else
            SendWarningMessage(typeof(OnButtonDelegate).Name); //This will send warning message if no script is listening to this invoker when it invoked
    }
```

change the code in Step 4 to return bool value

```
    bool DummyButtonCall(string text)
    {
        Debug.Log(text);
        
        return true; //this will determine if it's a tick or cross the button respond with.
    }
```

<figure><img src="/files/Kf3x08YENVGECSN3qA21" alt=""><figcaption></figcaption></figure>

Tips : Here is how to find the class that are relevant to the event, quickly and easily.

<figure><img src="/files/wxIEGm889il04xnkFl8r" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://freedom-developer.gitbook.io/the-chess/the-uis/ui-events.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
