Use a TextArea widget to enable a user to enter multiple lines of text. For example, you can add a TextArea widget to the Feedback section of an application to enable users to enter comments.

To learn how to use this widget programmatically, refer Quantum Visualizer Widget guide.

Important Considerations

The following are important considerations for a TextArea Widget.

Look Properties

Look properties define the appearance of the widget. The following are the major properties you can set:

For descriptions of the properties available on the Look tab of the Properties pane, see Look.

Skin Properties

Skin properties define a skin for the widget, including background color, borders, and shadows. If the widget includes text, you can also specify the text font.

For the TextArea widget, you can apply a skin and its associated properties for the following states:

Skin Definition
Normal The default skin of a widget.
Focus The skin applied when the widget has the focus.
Blocked UI

The skin applied to block the interface until the action in progress (for example, a service call) is completed.

Note: The Blocked UI skin is available only for SPA platforms.

Placeholder The skin applied to placeholder text in the widget. Only the font color skin attribute is applicable.
Hover Skin

The look and feel of a widget when the cursor hovers over the widget.

Note: The Hover skin is available only on the Windows (native) Tablet platform.

For more information about applying skins, see Understanding Skins and Themes.

Text Area Properties

TextArea properties specify properties that are available on any platform supported by Quantum Visualizer, and assign platform-specific properties.

Note: In this section, the properties that can be forked are identified by an icon ( ) located to the left of the property. For more information, see Fork a Widget Property.

Max Characters

Specifies the maximum number of characters that the text field can accept.

Input Mode

Specifies whether the text area accepts any characters or only numeric values. The Numeric Only option is not supported on server-side Mobile Web platforms.

Keyboard Style

Specifies the style of keyboard displayed when a user enters text or numeric values in the text area.

Note: This property is specific to the Android platform.


Specifies placeholder text for the text area; for example, a hint that describes what should be entered.

Auto Correct

Specifies whether auto-correction is enabled. Click the ellipsis (...) button to make the Auto Correct property setting platform-specific.

Note: You cannot execute this property on the Visualizer Canvas.

Note: This property is specific to the iOS and the SPA platform.

Auto Capitalize

Specifies the character capitalization behavior.

Following are the options available:

Pasteboard Type

Enables an application to share data within the application or with another application using system-wide or application-specific paste boards.

Typically, an object in the application writes data to a pasteboard when the user requests a copy or cut operation on a selection in the user interface. Another object in the same or different application then reads that data from the pasteboard and presents it to the user at a new location; this usually happens when the user requests a paste operation.

Note: You can only paste the text to a text area with the same pasteboard type as that of the source textbox. For example, if you set the Pasteboard type as App Level Persistent , you can paste the text only to another text area whose pasteboard type is also set to App Level Persistent .

Note: This property is specific to the iOS platform.

Close Button

Specifies whether the keypad window displays a Done button.

Note: This property is specific to the iOS platform.

Close Button Text

Specifies alternate text for the "Done" button. This property is available only when the Close Button is enabled.

Note: This property is specific to the iOS platform.

Progress Indicator

Specifies whether to display a progress indicator showing that widget content is being loaded.

Note: This property is specific to the iOS platform.

Keyboard Action Label

Specifies the text displayed on the action key of the keyboard.

Default: Done

For example, the following shows the keyboard action label set to "Search":

Note: This property is specific to the iOS platform.

Tool Tip

For the Windows Tablet platform, specifies a message that displays when you hover the mouse pointer over the widget .


Actions define what happens when an event occurs. On a TextArea widget, you can run an action when the following events occur:

For more information, see Add Actions.

Placement Inside a Widget

The following table summarizes where a TextArea2 widget can be placed:

Flex Form Yes
VBox Form Yes
FlexContainer Yes
FlexScrollContainer Yes
HBox Yes
VBox Yes
ScrollBox Horizontal Orientation - Yes
Vertical Orientation- Yes
Tab Yes
Segment No
Popup Yes


Header- No
Footer- No

Widget Appearance on Platforms

The appearance of the TextArea2 widget varies as follows:

Platform Appearance






Rev Author Edits
7.2.1 SHS SHS
Copyright © 2020 Temenos. All rights reserved.