UI Components
TextView
UI component for multi-line text entry.
<TextView>
is a UI component for multi-line text entry. When set to read-only, it can also be used to display multi-line text.
For single-line text input, see TextField.
<TextViewtext="{{ text }}" />
consttext=`TextView\nWith\nMultiple\nLines!`
<TextView[text]="text" />
text =`TextView\nWith\nMultiple\nLines!`;
<textViewtext={text} />
<textviewtext={text} />
<textView{text} />
<TextView :text="text" />
Examples β
Formatting text inside a TextView β
If you need to style parts of the text, you can use a combination of a FormattedString
and Span
elements.
<TextView>
<FormattedString>
<Spantext="This text has a " />
<Spantext="red "style="color: red" />
<Spantext="piece of text. " />
<Spantext="Also, this bit is italic, "fontStyle="italic" />
<Spantext="and this bit is bold."fontWeight="bold" />
</FormattedString>
</TextView>
Props β
text β
text: string
Gets or sets the text of the TextView.
hint β
hint: string
Gets or sets the placeholder text for the TextView.
editable β
editable: boolean
When set to false
the TextView is read-only.
Defaults to true
.
keyboardType β
keyboardType: CoreTypes.KeyboardType | number // "datetime" | "email" | "integer" | "number" | "phone" | "url"
Gets or sets the keyboard type shown when editing this TextView.
On iOS, any valid UIKeyboardType
number works, for example:
keyboardType =8// UIKeyboardType.DecimalPad
See CoreTypes.KeyboardType, UIKeyboardType.
returnKeyType β
returnKeyType: CoreTypes.ReturnKeyType // "done" | "go" | "next" | "search" | "send"
Gets or sets the label of the return key.
isEnabled β
Allows disabling the TextView. A disabled TextView does not react to user gestures or input.
Default value is true
.
maxLines β
maxLines: number
Limits input to the specified number of lines.
autocorrect β
autocorrect: boolean
Enables or disables autocorrect.
isWritingToolsActive 8.9+ β
(iOS Only) Are Apple Intelligence writing tools active.
isWritingToolsActive: boolean
enableWritingToolsEvents 8.9+ β
(iOS Only) Allow Apple Intelligence writing tools to emit text changes on each alteration instead of after the final change (default).
enableWritingToolsEvents: boolean
iosWritingToolsBehavior 8.9+ β
(iOS Only) Behavior for Apple Intelligence Writing Tools.
iosWritingToolsBehavior: WritingToolsBehavior
Can be Default
, Complete
, Limited
or None
.
iosWritingToolsAllowedInput 8.9+ β
(iOS Only) Allowed input for Apple Intelligence Writing Tools.
iosWritingToolsAllowedInput: Array<WritingToolsAllowedInput>
Can be Default
, List
, PlainText
, RichText
or Table
.
...Inherited β
For additional inherited properties not shown, refer to the API Reference.
Methods β
focus() β
focus(): boolean
Focuses the TextView and returns true
if the focus was succeessful.
dismissSoftInput() β
dismissSoftInput(): void
Hides the on-screen keyboard.
Events β
textChange β
on('textChange', (args:PropertyChangeData) => {
consttextView= args.object asTextView
console.log('TextView text changed:', args.value)
})
Emitted when the input text changes.
Event data type: PropertyChangeData
returnPress β
on('returnPress', (args:EventData) => {
consttextView= args.object asTextView
console.log('TextView return key pressed.')
})
Emitted when the return key is pressed.
focus β
on('focus', (args:EventData) => {
consttextView= args.object asTextView
console.log('TextView has been focused')
})
Emitted when the TextView gains focus.
blur β
on('blur', (args:EventData) => {
consttextView= args.object asTextView
console.log('TextView has been blured')
})
Emitted when the TextView loses focus.
Native component β
- Android:
android.widget.EditText
- iOS:
UITextView
- Previous
- TextField
- Next
- TimePicker