Text Field

Overview

A Text Field consists of a Label, a binding Text or Number value, and an Axis parameter. It can be customized with the Text Field Style modifier.

You can use the Label parameter as placeholder text or to set an explicit prompt to guide users on what text they should provide.

To ensure that the Text Field control works when a user interacts with it, place the text field in a component and bind the Text parameter to a Text or Number component property. You can either create the property before you bind it or create the property directly in the control parameters in the Inspector panel.

If it’s a Text value, the Text Field updates the value continuously as the user types or edits the text in the field. For Number values, the Text Field updates the value when the user commits their edits, such as by pressing the Return key.

Axis Property

Use the Axis parameter on your Text Field control to build text fields that expand Vertically or Horizontally as a user’s typed content grows.

<div class="callout note">Note
If you choose the Horizontal axis, the Text Field will grow as the user types, but once the Return key is hit, the Text Field will only display the beginning of the content and add an ellipses to maintain the size of the Text Field.</div>