TextView

Extends Widget

A widget to display a text. For images, use ImageView.

Import this type with “const {TextView} = require('tabris');

Android iOS
TextView on Android TextView on iOS

Properties

alignment

Type: string, supported values: left, right, center, default: left

The horizontal alignment of the text.

lineSpacing

Type: number, default: 1.0

The amount of space between each line of text. The lineSpacing property is a factor with a default value of 1.0.

markupEnabled

Type: boolean

Allows for a subset of HTML tags in the text. Supported tags are: a, del, ins, b, i, strong, em, big, small, br. All tags must be closed (e.g. use <br/> instead of <br>). Nesting tags is currently not supported.
This property can only be set on widget creation. Once set, it cannot be changed anymore.

maxLines

Type: number|null, default: null

Limit the number of lines to be displayed to the given maximum. null disables this limit.

selectable

Android

Type: boolean

Whether the text can be selected or not. Currently only support on Android.

text

Type: string

The text to display.

textColor

Type: Color

The color of the text.

Events

alignmentChanged

Fired when the alignment property has changed.

Event Parameters

  • target: this The widget the event was fired on.

  • value: string The new value of alignment.

lineSpacingChanged

Fired when the lineSpacing property has changed.

Event Parameters

  • target: this The widget the event was fired on.

  • value: number The new value of lineSpacing.

maxLinesChanged

Fired when the maxLines property has changed.

Event Parameters

  • target: this The widget the event was fired on.

  • value: number|null The new value of maxLines.

selectableChanged

Fired when the selectable property has changed.

Event Parameters

  • target: this The widget the event was fired on.

  • value: boolean The new value of selectable.

Fires when the user clicks on a link in an html text. Requires to set markupEnabled to true and to provide a text containing an anchor (<a>) with an href attribute. Eg. textView.text = 'Website: <a href="http://example.com>example.com</a>'. The event object contains a property url which provides the anchors href url.

Event Parameters

  • target: this The widget the event was fired on.

  • url: string The url referenced by the href attribute of the anchor.

textChanged

Fired when the text property has changed.

Event Parameters

  • target: this The widget the event was fired on.

  • value: string The new value of text.

textColorChanged

Fired when the textColor property has changed.

Event Parameters

  • target: this The widget the event was fired on.

  • value: Color The new value of textColor.

Example

const {TextView, ui} = require('tabris');

// Create text views with different alignments

new TextView({
  left: 10, top: 10, right: 10,
  text: 'Left',
  alignment: 'left'
}).appendTo(ui.contentView);

new TextView({
  left: 10, top: 'prev() 10', right: 10,
  text: 'Center',
  alignment: 'center'
}).appendTo(ui.contentView);

new TextView({
  left: 10, top: 'prev() 10', right: 10,
  text: 'Right',
  alignment: 'right'
}).appendTo(ui.contentView);

See also