How to create simple editable text box

[Fairly new to Defold; experienced in Lua]
I am not able to create a simple text box with standard simple editing: cursor, move left/right, tap to move cursor. Nothing fancy, just standard text box.

I have built from scratch a text box that does pretty much everything, though detecting when caps lock gets turned off is a challenge because no event, just absence of the event. And detcting the precise location of a tap in the text (to reposition the cursor) is iffy at best. But I have to do everything myself.

Worse, because I use Druid for buttons, input never receives action.text, so I have to handle every letter in a giant if loop, checking if the last key was one of the shift keys. And, becuase of Druid (?) there is no gui.set_text_input() for my text node (which is supposed to turn on action.text?). Using the Druid node:set_text_input_enabled(true) also does not fill action.text.

I use self.druid:new_input(node… which works fine, but doesn’t do any editing other than delete.

There must be a simple way to make a standard text box? What am I missing?

I also tried Druid new_rich_text but it requires a template as input but I don’t know what to put in that template.

You can create a gui node to focus and represent text.

i found this may help you. Also check available properties from api reference

1 Like

Yes, I have done that, but it is only a text string, not an editable box. There is no cursor, the user cannot use the arrow keys or tap to move the curser. It is text entry only, not an editable text box.

i didnt use but probabaly you need to make a custom solution, as i know defold doesnt give you.For example listen touch on node if clicked simulate a cursor. if user tap and drag over node give that cursor a index by calculating text lenght and position on node. It looks too much work because normally we dont think these type of things in game engines because they give us ready made except defold :slight_smile:

Yes, every other game engine I have worked with has it as standard kit. Touch is a real problem because it is very hard to figure where in the text accurately. I have built my own, but this is disappointing.

You can use the text input box from Dear ImGUI in Defold:

Or you can use the Rich Input field from Druid:

Hello!

Currently, Druid has two input components: Input and Rich Input. Input is a very basic barebones input, with required Box GUI node and Text GUI node.

Rich Input is required a template with special node structure, but it comes with a cursor, selection, placeholder etc

To use it, currently, you have to copy the rich_input.gui template from the Druid folder, apply your own textures and add this template inside your GUI script.

When your template is on scene, you able to create instance of Rich Input with next lines of code

local druid = require("druid.druid")
local rich_input = require("druid.custom.rich_input.rich_input")

function init(self)
    self.druid = druid.new(self)
    self.rich_input = self.druid:new(rich_input, "rich_input") -- "rich_input" here is a template name on the GUI scene
end

Also you need to check you input bindings is correct (druid/docs_md/advanced-setup.md at master · Insality/druid · GitHub)

That should be enough for basic setup to make it works (also check an simple example link for Druid provided by Britzl)

I know there now a several issues for input component itself, the fixes on the way. Also I want to make this workflow much easier (to able users use the Druid templates), but on current version this is the way to achieve this.

5 Likes