Search Unity

How do you detect if someone clicks "Enter/Return" on a TextField

Discussion in 'UI Toolkit' started by SonicBloomEric, Jun 2, 2019.

  1. SonicBloomEric

    SonicBloomEric

    Joined:
    Sep 11, 2014
    Posts:
    1,089
    I'm working on a simple UI with an extremely basic interaction: user types in some text and presses "Enter/Return" to commit the text. I understand how to get "change" events. I don't care about those. What I care about is when the user expressly "commits" their adjusted text.

    Attempts to detect "Enter/Return" have been unsuccessful. It seems that the TextField UIElement swallows all Keyboard events when it has focus so attempts to add KeyDown event listeners to the element are useless.

    I feel like I must be missing something obvious here. How do you detect a "commit" action in a TextField?
     
    SonicBloomEric, Jun 2, 2019
    #1

  2. antoine-unity

    antoine-unity

    Unity Technologies

    Joined:
    Sep 10, 2015
    Posts:
    780
    Hello,

    You should be able to achieve the desired behaviour by enabling the "delayed" behaviour of the TextField : 
    textField.isDelayed=true
    . This will make make the 
    ChangeEvent<string>
    be delayed until the user presses enter or gives away focus, but will also won't notify you the user cancels with Escape.

    If you do need to grab keyboard events directly, then it becomes necessary to add an event handler on a child of the TextField which is the object representing the actual input area.

    The way to achieve this is to use uQuery : 
    textField.Q(TextField.textInputUssName).RegisterCallback<KeyDownEvent>(e => ...);


    This is a common pitfall which will document explicitly in the manual.

    Thanks,
     
    antoine-unity, Jun 3, 2019
    #2
    andrew-lukasik and BinaryCats like this.

  3. SonicBloomEric

    SonicBloomEric

    Joined:
    Sep 11, 2014
    Posts:
    1,089
    That's neat, except that "losing focus" doesn't mean the same thing as "commit". Think a simple thing like Google's search box. If you were to switch tabs or click outside of the search box you wouldn't expect it to "commit", right? Nah. In web lingo, "Form"-style inputs aren't easily reproducible with UIElements compatible with the TextField "element".

    Cool. This looks like it should support what I'm looking to do.

    I will add that it is somewhat surprising that the TextField element "captures" the input events. Perhaps adding this to the documentation would be helpful.
     
    SonicBloomEric, Jun 3, 2019
    #3

  4. antoine-unity

    antoine-unity

    Unity Technologies

    Joined:
    Sep 10, 2015
    Posts:
    780
    This is to honour the requirements of how text fields behave in the inspector in Unity where giving away focus applies the value. Generally delayed field are a way to avoid glitches or avoid recomputing something heavy so it's true that a search box isn't a good use case for it.

    Yes we need a good "how to" section for our text field, will definitely include this here.
     
    antoine-unity, Jun 3, 2019
    #4
    SonicBloomEric likes this.

  5. SonicBloomEric

    SonicBloomEric

    Joined:
    Sep 11, 2014
    Posts:
    1,089
    Interesting.

    I would like to suggest the following:
    • UIEngine.UIElements.TextField - A truly simple text field. Handles text input and has a few modes for how to represent text (e.g. passwords vs plain text). Makes no assumptions about events.
    • UIEditor.UIElements.TextField - [new!] Takes on the role of the current TextField, reproducing the requirements of text inputs in Unity's Inspector.
    I feel like this separation would be useful for people looking to build their own custom tools built around a simple TextField. It would also become extremely handy once UIElements begins working in builds and you don't have the same concerns as the Editor...
     
    SonicBloomEric, Jun 3, 2019
    #5
    Kekito, JoNax97 and Sylmerria like this.

  6. kayy

    kayy

    Joined:
    Jul 26, 2011
    Posts:
    110
    Now in 2022 you register directly at the TextField instead of its TextInput child i.e.:

    Code (CSharp):
    1. textField.RegisterCallback<KeyDownEvent>(e => ...);
     
    kayy, Jun 22, 2022
    #6
    MuntyMcFly likes this.