Search Unity

  1. Welcome to the Unity Forums! Please take the time to read our Code of Conduct to familiarize yourself with the forum rules and how to post constructively.
  2. Dismiss Notice

Is there no "placeholder" text property for TextField()?

Discussion in 'UI Toolkit' started by MostHated, Sep 1, 2020.

  1. MostHated

    MostHated

    Joined:
    Nov 29, 2015
    Posts:
    1,218
    Heya,
    I was trying to add "placeholder" text to a TextField but I don't see anything by that name. Is it named something else and I am just not seeing it or does it really not exist? I saw "usageHint" and thought perhaps that might be it, but after reading the description of it, probably not.

    I imagine that in the meantime I could probably hack one together using events and adjusting the font color, but I feel that I really shouldn't have to do that. Hopefully, this will be added?

    Thanks,
    -MH
     
  2. jonathanma_unity

    jonathanma_unity

    Unity Technologies

    Joined:
    Jan 7, 2019
    Posts:
    229
    Hi MostHated,

    There are no built in support for "placeholder" text on the TextField. The current work around is to add this functionality yourself.
     
  3. MostHated

    MostHated

    Joined:
    Nov 29, 2015
    Posts:
    1,218
    I understand. I appreciate the reply. I would, though, like to request that one day this be considered to be added if possible.
     
    jonathanma_unity likes this.
  4. jonathanma_unity

    jonathanma_unity

    Unity Technologies

    Joined:
    Jan 7, 2019
    Posts:
    229
    Just got the confirmation that it's already in the backlog.
     
    Mj-Kkaya, Exanite and MostHated like this.
  5. MostHated

    MostHated

    Joined:
    Nov 29, 2015
    Posts:
    1,218
    Awesome, good deal. I appreciate it.
     
  6. liuhuan0924

    liuhuan0924

    Joined:
    Sep 2, 2020
    Posts:
    9
    I have completed this implementation, if you need to contact 771383629@qq.com
     
  7. MostHated

    MostHated

    Joined:
    Nov 29, 2015
    Posts:
    1,218
    RKar and jonathanma_unity like this.
  8. Oneiros90

    Oneiros90

    Joined:
    Apr 29, 2014
    Posts:
    77
    Here's my implementation:
    Code (CSharp):
    1. public static void SetPlaceholderText(this TextField textField, string placeholder)
    2. {
    3.     string placeholderClass = TextField.ussClassName + "__placeholder";
    4.  
    5.     onFocusOut();
    6.     textField.RegisterCallback<FocusInEvent>(evt => onFocusIn());
    7.     textField.RegisterCallback<FocusOutEvent>(evt => onFocusOut());
    8.  
    9.     void onFocusIn()
    10.     {
    11.         if (textField.ClassListContains(placeholderClass))
    12.         {
    13.             textField.value = string.Empty;
    14.             textField.RemoveFromClassList(placeholderClass);
    15.         }
    16.     }
    17.  
    18.     void onFocusOut()
    19.     {
    20.         if (string.IsNullOrEmpty(textField.text))
    21.         {
    22.             textField.SetValueWithoutNotify(placeholder);
    23.             textField.AddToClassList(placeholderClass);
    24.         }
    25.     }
    26. }
    Usage:
    Code (CSharp):
    1. myTextField.SetPlaceholderText("Placeholder text");
    You can also customize its appearance in USS:
    Code (CSharp):
    1. .unity-text-field__placeholder > .unity-base-text-field__input {
    2.     color: #969696
    3. }
     
  9. chadfranklin47

    chadfranklin47

    Joined:
    Aug 11, 2015
    Posts:
    217
    Last edited: Feb 25, 2022
  10. MostHated

    MostHated

    Joined:
    Nov 29, 2015
    Posts:
    1,218
    watsonsong and Xan_9 like this.
  11. watsonsong

    watsonsong

    Joined:
    May 13, 2015
    Posts:
    555
    The placeholder is really an useful feature.
    Code (CSharp):
    1.  
    2. // Hopefully these features will eventually be in the default TextField eventually.
    3. internal class BetterTextField : TextField
    4. {
    5. }
    6.  
    'Hopefully these features will eventually be in the default TextField eventually.' When it come true?
     
  12. yukunlinykl

    yukunlinykl

    Joined:
    Dec 17, 2021
    Posts:
    21
  13. HugoBD-Unity

    HugoBD-Unity

    Unity Technologies

    Joined:
    May 14, 2018
    Posts:
    440
    Hi everyone!

    Placeholder is finally supported by default for TextField and ValueTypeFields. For more info, please look into this thread.
     
    Mj-Kkaya and yukunlinykl like this.
  14. ichenpipi

    ichenpipi

    Joined:
    Feb 24, 2021
    Posts:
    3
    Try this:
    Code (CSharp):
    1. public string inputContent = "";
    2. public string placeholder = "Text here...";
    3. private void OnGUI() {
    4.     // Draw TextArea
    5.     inputContent = EditorGUILayout.TextArea(inputContent, GUILayout.ExpandWidth(true), GUILayout.ExpandHeight(true));
    6.     // Draw Plcaeholder
    7.     if (string.IsNullOrEmpty(inputContent)) {
    8.         Rect pos = new Rect(GUILayoutUtility.GetLastRect());
    9.         GUIStyle style = new GUIStyle
    10.         {
    11.             alignment = TextAnchor.UpperLeft,
    12.             padding = new RectOffset(3, 0, 2, 0),
    13.             fontStyle = FontStyle.Italic,
    14.             normal =
    15.             {
    16.                 textColor = Color.grey
    17.             }
    18.         };
    19.         EditorGUI.LabelField(pos, placeholder, style);
    20.     }
    21. }
    It looks like:
    upload_2022-11-4_14-53-30.png
     
    digitalbreed and HugoBD-Unity like this.