Defold engine has no ready to use button object. So we need to create our own button.

I will use an example mentioned in the Defold documentation.

Setup

First of all, we need to create a gui file in main folder. Name of the file is not important but we can name it as button.gui. Same way, we need to create a .gui_script file in the same folder.Can be named as button.gui_script.

Then double click button.gui file and select button.gui_script in the properties section on the right side.

Now on the right top corner you will see gui related files like(Nodes, Textures, Fonts, etc.). Right click on Nodes folder and add a box node(name it as button).

Then create a text node under the box node. If you see a error on text node, it means you have not added a font yet.

Click Fonts folder and add a font file. Then you can choose this font in the text node properties. Final screen should looks like this.

When defold engine runs, it will start from main.collection file. So we need to add our button.gui file in the main.collection file.

• Right click on Collection and select Add Game Object.
• Then Add Component File under this new component.
• You will see our created button.gui file in the list.

Now final looks like this.

Coding

Now we need to add some code in the button.gui_script file.

-- This is a special function that is called when the script is loaded.
function init(self)
    -- We need to add this line to be able to receive input events.
    msg.post(".", "acquire_input_focus") 
end


-- This function is called when input events are received.
-- It is called every frame and receives the action_id and action as parameters.
function on_input(self, action_id, action)
    -- touch name is defined in input bindings file.
    if action_id == hash("touch") and action.pressed then 
        local button = gui.get_node("button") 
        local text = gui.get_node("text") 
        if gui.pick_node(button, action.x, action.y) then 
            gui.set_text(text, "HELLO!") -
        end
    end
end

Actually comments explain everything.But we walk through the code.

• init function is called when the script is loaded. We need to use acquire_input_focus to be able to receive input events.

• on_input function is called when input events are received. It is called every frame and receives the action_id and action as parameters.

• action_id is the id of the action that was triggered. In our case it is “touch”.

• action is a table that contains information about the action. It contains the following fields:

  • pressed: true if the action was pressed, false if it was released.
  • x: x position of the touch event.
  • y: y position of the touch event.

• gui.pick_node is used to check if the touch event is inside the button node. If it is, we set the text of the text node to “HELLO!”.

• gui.set_text is used to set the text of the text node.

The information shared on DefoldMaster is based on my personal experience and learning process with the Defold game engine. While I strive to provide accurate and helpful content, mistakes may still occur. If you find any errors or inaccuracies in an article, please feel free to reach out to me from social accounts. Your feedback is greatly appreciated and helps improve the quality of the resources shared.