I’m using the edit box for the login Username and Password, then I have a Login button that calls the function onLogin()… What I want to do is trigger the function when you press return from the password box. That’s just common practice to submit with Enter after you type in the password, but I don’t understand the way KeyboardReturnType is structured, and it’s not documented. We can change it to DONE, SEND or GO, but what does that do? There’s no convenient way to call a trigger when return is pressed. Do I have to do it as a listener looking for the Enter key with the Text Changed or Editing Did Ended? Just a little confusing, but I’m sure other people would want to be able to do this as well… Also to use the Tab key to change focus to next component, but I know that’s been requested already. Thanks.
I have added another event type to EditBox in v1.2 and this version will be release soon.
This kind of event will only be triggered when Enter key is pressed.
For the keyboard return type is only used for mobile keyboard.
And I’m also considering to add setFocus API to EditBox, but it needs more discussion, I thin it’s only useful on PC platforms, right?
That would be great, thanks Owen. Yes, this is more practical on a desktop than mobile, but the mobile keyboards usually have a key to go to the next field and to submit, so it does apply there too. I understand the KeyboardReturnType now, to make enter into a Go key on the virtual keyboard, but without the onReturnPressed function there’s no way to take advantage of that at the moment.
I see what you’re doing with the input fields only being active when you click on the EditBox, and when it’s not focused it turns the input into a label… While that does seem like a clever approach, I’m not sure it was the best way to go. It can get glitchy on some platforms where it changes the way the text looks when you’re on or off it, for example the Password mask, I notice on my browser the ***'s get smaller when you click on it then full size when you’re off. Seems like it would have been easier to keep the input box there always, and have the hint text, X clear, password peak button and whatever else as an overlay on top of the input area. That would also make the setFocus and tab stuff work better too. While the component is cool, I’m wondering if there’s any way to hack it to use a regular HTML <input type=“text” in place of it and still have the compatibility… I could try to figure it out, but maybe I should just wait for v1.2… Thanks.
I think there should be a option which could make the DOM input almost on top of canvas.
Than we could use TAB to navigate between different EditBox.
I will consider to add this feature in the next version.
Thanks.
I am also stuck at using editbox to trigger send button when making chat app. Can you show me another way to send a message by clicking a button please. I have tried 4 days but still havent found a solution yet.
I think you could register a textChanged event of EditBox and test the text argument in the callback, if it is Enter key then you could manually fire the button’s event(or call the button callback function directly)
Alright, problem resolved with the new version, thank you guys for adding it in… Now on the EditBox field, there is a property for Tab Index and Editing Return. Worked as easy as 1, 2, 3 too, not being able to press tab to go between username/password got annoying. Much better.
You have Tab Index? I’m writing raw C++ code, with 3.16. Is there any plan to supporting some sort of “go to next field” for the C++ version? Even on iOS, if I hit enter, I’d like the option to move to another field (but still would like to close the keyboard if I tap outside the editbox).
thanks
[update, I’ve found a way to go to the next field by calling “onExit” on the current editBox and then an event on the next one. Now I’ll look for a way to be able to close the editbox if I click outside. If I find a solution, I’ll post it]
Got it! Works great on iOS, and I’ll test it in Windows asap.
-
when creating an EditBox, set return type to NEXT
box->setReturnType(ui::EditBox::KeyboardReturnType::NEXT); -
in your editBoxEditingDidEndWithAction(EditBox *box, EditBoxEndAction action) method, check for the action.
- if action == TAB_TO_NEXT, go to the next field
- else (they hit return on desktop or tapped outside on iOS), don’t advance, just close
Sorry for the spam, just sharing in case anyone else wants to add this. It turns out that 3.17 greatly improves EditBox, and I now have this working in both iOS and Windows (still to test Mac, but I’m sure it’ll be good). Thanks to the cocos2dx team!
Hi @owen. I’m having problem with editbox on win32 fullscreen game.
When I click on edit box text hides until I finish editing. I think editbox is not being on top in fullscreen mode. If I run my game in window rather than fullscreen everything works fine.
Is there any workaround for my situation?
I’m using Cocos Creator 1.9.3.
Thanks in advance.