This component is not supported for Google Ads, Google AdMob, AMPHTML ads , video ads , or image ads .
The Text Field component lets you add a field where users can enter text.
To use the Text Field component in your project:
- Open the Componentspanel, then the UIfolder.
- Drag the Text Field
component to the stage.
- You may want to use the Label component to display text before the text field.
Properties
| Property | Description |
|---|---|
| Name | The component name. |
| Placeholder | The text shown to users inside the text field when nothing has been entered. The placeholder is for display only, and doesn't affect the field's value. |
| Value | The default text in the text field. The value overrides the placeholder. |
Events and actions
Events sent by the Text Field componentYou can trigger other actions based on the following Text Field component events:
| Event | Description |
|---|---|
| Change | Sent when a change to the text field's value is committed (e.g., the user edits the value then clicks elsewhere on the page). |
| Input | Sent when the text field's contents changes. |
To select one of these events in the Eventdialog, set the Text Field component as the target.
The following Text Field component actions can be triggered in response to other events:
- Start index- A number representing the first character of the selection. Use
0to start with the first character. - End index- A number representing the character after the last character of the selection. Use
1to end after the first character. If the end index is greater than the total number of characters in the field, the selection ends after the last character.
When you select one of these actions in the Eventdialog, set the Text Field component as the receiver.
Learn how to configure events .
Preview
You can't interact with UI components inside the Google Web Designer interface. To see the component in action, preview your document in your preferred browser. The appearance of UI components may vary depending on the browser.

