Olympe SDK

Class: TextArea

olympe.ui.std. TextArea

A TextArea is a text component that allows for the editing of multiple lines of text.

Example:

const textArea = new olympe.ui.std.TextArea(new Vector2(200, 100))
    .setPosition(new Vector2(10, 250))
    .setTextColor(olympe.df.Color.red())
    .setBorder(3, olympe.df.Color.gray());

Will create the following component:

TextArea

new TextArea( [dimension], themeClass)

Creates an instance of TextArea with a given dimension.

Parameters:
Name Type Argument Description
dimension olympe.df.PVector2 <optional>

The dimension (w, h) for this TextArea.
themeClass olympe.df.POString | string

The name of the theme class for this element.
Implements:

Extends

Methods

getEventKeyDown()

Gets the 'Key Down' events. i.e. the key has been pressed down.

Implements:
Returns:

Key event

Type
olympe.df.Proxy.<olympe.ui.events.KeyEvent> | olympe.ui.events.KeyEvent

getEventKeyPressed()

Gets the 'Key Pressed' events. i.e. a key has been pressed then released.

Implements:
Returns:

Key event

Type
olympe.df.Proxy.<olympe.ui.events.KeyEvent> | olympe.ui.events.KeyEvent

getEventKeyUp()

Gets the 'Key Up' events. i.e. when a key is released back after being pressed.

Implements:
Returns:

Key event

Type
olympe.df.Proxy.<olympe.ui.events.KeyEvent> | olympe.ui.events.KeyEvent

getFocus()

Checks whether this Element has the focus.

Warning: Focus may not be applicable on some elements, depending on the platform.

Inherited From:
Overrides:
Returns:

true if Element has focus.

Type
olympe.df.POBoolean

<protected> getGestureEvent()

Gets the gesture event manager attached to this element

Inherited From:
Overrides:
Returns:
Type
olympe.ui.events.GestureEventManager

getHeight()

Gets the height of this element.

Inherited From:
Overrides:
See:
Returns:

the height of this element.

Type
olympe.df.PONumber

getHTMLElement()

Return the DOM HTMLElement if exists (may be null)

Inherited From:
Overrides:
Returns:
Type
Element

getKeyEvent()

Gets the key event manager attached to this element.

Returns:

The key event manager.

Type
olympe.ui.events.KeyEventManager

<protected> getMouseEvent()

Gets the mouse event manager attached to this element.

Inherited From:
Overrides:
Returns:

the mouse event manager.

Type
olympe.ui.events.MouseEventManager

getParent()

Gets the parent, or container, of this element.

Inherited From:
Overrides:
Returns:

the parent of this element.

Type
olympe.ui.std.Element | olympe.df.Proxy

getPosition()

Gets the position (x,y) for this element.

Inherited From:
Overrides:
Returns:

Position of this element.

Type
olympe.df.PVector2

getText()

Returns the text contained in this TextArea.

Returns:

The text.

Type
olympe.df.POString

getUIProxyDockableElement()

Note: needs to be public because it is called by RootElement !

Inherited From:
Overrides:
Returns:

The proxy element from the UI thread

Type
olympe.uiapi.std.DockableElement

<protected> getUIProxyElement()

Returns the native UI element associated with this Element.

Inherited From:
Overrides:
Returns:

The proxy element from the UI thread.

Type
olympe.uiapi.std.Element

<package> getUIProxyTextArea()

Returns:

Proxified UI object text area

Type
olympe.uiapi.std.TextArea

getValue()

Returns the text contained in this TextArea.

Deprecated:
Returns:

The text.

Type
olympe.df.POString

getWidth()

Gets the width of this element.

Inherited From:
Overrides:
See:
Returns:

the width of this element.

Type
olympe.df.PONumber

getX()

Gets the x coordinate of the position of this element.

Inherited From:
Overrides:
See:
Returns:

the x coordinate for this element.

Type
olympe.df.PONumber

getY()

Gets the y coordinate of the position of this element.

Inherited From:
Overrides:
See:
Returns:

the y coordinate for this element.

Type
olympe.df.PONumber

isHidden()

Checks whether this Element is hidden.

Inherited From:
Overrides:
Returns:

true is this element is hidden.

Type
olympe.df.POBoolean

offKeyDown(id)

Unregisters a callback from 'Key Down' events.

Parameters:
Name Type Description
id string

id the Id of the callback (returned by onKeyDown)
Implements:

offKeyPressed(id)

Unregisters a callback from 'Key Pressed' events.

Parameters:
Name Type Description
id string

id the Id of the callback (returned by onKeyPressed)
Implements:

offKeyUp(id)

Unregisters a callback from 'Key Up' events.

Parameters:
Name Type Description
id string

id the Id of the callback (returned by onKeyUp)
Implements:

onKeyDown(callback [, id] [, priority])

Registers a callback for 'Key Down' events.

Parameters:
Name Type Argument Default Description
callback olympe.ui.events.OnKeyEventCallback

the callback to register
id string <optional>

Id of event auto-generated if omitted
priority number <optional>
 0

Priority of event (higher number = higher priority)
Implements:
Returns:

Id of the callback

Type
string

onKeyPressed(callback [, id] [, priority])

Registers a callback for 'Key Pressed' events.

Parameters:
Name Type Argument Default Description
callback olympe.ui.events.OnKeyEventCallback

the callback to register
id string <optional>

Id of event auto-generated if omitted
priority number <optional>
 0

Priority of event (higher number = higher priority)
Implements:
Returns:

Id of the callback

Type
string

onKeyUp(callback [, id] [, priority])

Registers a callback for 'Key Up' events.

Parameters:
Name Type Argument Default Description
callback olympe.ui.events.OnKeyEventCallback

the callback to register
id string <optional>

Id of event auto-generated if omitted
priority number <optional>
 0

Priority of event (higher number = higher priority)
Implements:
Returns:

Id of the callback

Type
string

refreshSize()

Refresh component internal size

Inherited From:
Overrides:

removeTooltip()

Removes the tooltip from this element.

Inherited From:
Overrides:
Returns:

This element.

Type
olympe.ui.std.Element

setAccelerated(accelerated)

Sets whether this DockableElement movements should be calculated by the GPU.

Note: This function doesn't guarantee that the implementation will support GPU acceleration.

Parameters:
Name Type Description
accelerated olympe.df.POBoolean | olympe.df.Node | boolean

true if this DockableElement movements should be calculated by the GPU.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setAutoResize(autoResize)

Enables or disables the automatic resizing of this component to match its content's size. In effect the height of this TextArea will grow or shrink depending on the number of lines in the text.

Parameters:
Name Type Description
autoResize olympe.df.POBoolean | boolean

true to enable auto-resizing, false to disable it.
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setBackgroundColor(color)

Sets the background color for this Element.

Parameters:
Name Type Description
color olympe.df.Proxy | olympe.df.Node | olympe.df.Color

The background color.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBackgroundImage(url [, sizingMode] [, positioningMode] [, size] [, position])

Sets the background image for this Element.

Notes:

  • The size is ignored if the sizing mode is not set to MANUAL.
  • The position is ignored if the positioning mode is not set to MANUAL.
Parameters:
Name Type Argument Default Description
url olympe.df.POString | olympe.df.Node | string

URL for the image.
sizingMode olympe.ui.common.BackgroundImageSize | olympe.df.Proxy | olympe.df.Node <optional>
 AUTO

The sizing mode for the image.
positioningMode olympe.ui.common.BackgroundImagePosition | olympe.df.Proxy | olympe.df.Node <optional>
 TOPLEFT

The positioning mode for this image.
size olympe.df.Vector2 | olympe.df.Proxy | olympe.df.Node <optional>

Size, in pixel.
position olympe.df.Vector2 | olympe.df.Proxy | olympe.df.Node <optional>

Position of the image, in pixel. (0,0) if omitted.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBackgroundImagePosition(position)

Sets the background image position for this Element.

Parameters:
Name Type Description
position olympe.df.Vector2 | olympe.df.Proxy | olympe.df.Node

The position.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBackgroundImagePositionMode(positionMode)

Sets the position mode for the background image of this Element.

Parameters:
Name Type Description
positionMode olympe.ui.common.BackgroundImagePosition | olympe.df.Proxy | olympe.df.Node

The positioning mode for this image.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBackgroundImageSize(size)

Sets the background image size for the this Element.

Parameters:
Name Type Description
size olympe.df.Vector2 | olympe.df.Proxy | olympe.df.Node

The image size, in pixels.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBackgroundImageSizeMode(sizeMode)

Sets the sizing mode for the background image of this Element.

Parameters:
Name Type Description
sizeMode olympe.ui.common.BackgroundImageSize | olympe.df.Proxy | olympe.df.Node

The sizing mode.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBackgroundImageSrc(src)

Sets the URL (or source) for the background image.

Parameters:
Name Type Description
src olympe.df.POString | olympe.df.Node | string

URL for the image.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBlur()

Removes focus from this Element.

Warnings:

  • Focus may not be applicable on some elements, depending on the platform.
  • Elements not inside a container (screen, etc.) can't get the focus.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setBorder(width, color)

Sets the border width & color for this element. a width of 0 means no visible border.

Parameters:
Name Type Description
width olympe.df.ONumber | number | olympe.df.Node | olympe.df.Proxy

the width, in pixels, for the border
color olympe.df.Color | olympe.df.Node | olympe.df.Proxy

the color for the border
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setBorderColor(color)

Set the border color on this element.

Parameters:
Name Type Description
color olympe.df.Color | olympe.df.Proxy.<olympe.df.Color>
Inherited From:
Overrides:
Returns:
Type
olympe.ui.std.DockableElement

setBorderWidth(width)

Set the border width on this element. a width of 0 means no visible border.

Parameters:
Name Type Description
width number | olympe.df.PONumber
Inherited From:
Overrides:
Returns:
Type
olympe.ui.std.DockableElement

setContextMenuEnabled(enabled)

Enable/disable context menu on this element.

Parameters:
Name Type Description
enabled boolean

true to enable the context menu, false to disable it.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setCornerRadius(radius)

Sets the rounded corner radius (in pixels) for this element.

Parameters:
Name Type Description
radius olympe.df.PONumber | olympe.df.Node | number

Radius in pixels.
Inherited From:
Overrides:
Returns:

this DockableElement.

Type
olympe.ui.std.DockableElement

setDimension(dimension)

Sets the dimension (width, height) for this element.

Parameters:
Name Type Description
dimension olympe.df.Vector2 | olympe.df.Proxy | olympe.df.Node

Dimension of this element.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setDisabled(isDisabled)

Enables or disables this component. A Disabled TextArea can not be edited by the user.

Parameters:
Name Type Description
isDisabled olympe.df.POBoolean | boolean | olympe.df.Node

true to disable this TextArea.
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setFocus()

Gives the focus to this Element.

Warnings:

  • Focus may not be applicable on some elements, depending on the platform.
  • Elements not inside a container (screen, etc.) can't get the focus.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setFontFamily(fontFamily)

Sets a list of comma-separated font families; the first one to be recognised by the platform will be used to display the text for this component. If a font name contains white spaces, it should be put between quotes.

Example:

textArea.setFontFamily('"Times New Roman", Times, serif');
Parameters:
Name Type Description
fontFamily olympe.df.POString | string | olympe.df.Node

comma separated list of font family names
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setFontSize(fontSize)

Sets the font size to use when displaying the text for this component.

Parameters:
Name Type Description
fontSize olympe.df.PONumber | number | olympe.df.Node

The desired size, in pixels, for the font.
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setFontStyle(fontStyle)

Sets the font style to use when displaying the text in this component.

Example:

textField.setFontStyle(olympe.ui.common.FontStyle.ITALIC);
Parameters:
Name Type Description
fontStyle olympe.ui.common.FontStyle | olympe.df.Proxy.<olympe.ui.common.FontStyle> | olympe.df.Node

the font style to use.
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setFontWeight(fontWeight)

Sets the font weight to use when displaying the text in this component. 400 is the same as normal, and 700 is the same as bold.

Parameters:
Name Type Description
fontWeight olympe.df.PONumber | number | olympe.df.Node

The font weight.
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setHidden(hidden)

Sets whether this Element is hidden or not. A hidden element will not appear on the screen.

Parameters:
Name Type Description
hidden olympe.df.POBoolean | boolean | olympe.df.Node

true if content must be hidden, false otherwise.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setIgnoreUserInteraction( [ignore])

Disables mouse events for this element. However, mouse events will target its descendants unless they are manually set to also ignore user interactions.

Parameters:
Name Type Argument Default Description
ignore boolean | olympe.df.POBoolean <optional>
 false

ignore true to make this element ignore mouse events and pass them to its children.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setOpacity(opacity)

Sets the opacity, or alpha channel, for this Element. This is a float value between 0 and 1. 0 being transparent and 1 being opaque.

Parameters:
Name Type Description
opacity olympe.df.ONumber | number | olympe.df.Proxy | olympe.df.Node

the opacity (between 0 and 1).
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setPaddingBottom( [paddingBottom])

Sets the padding, in pixels, to apply to the bottom of the text in this component.

Parameters:
Name Type Argument Default Description
paddingBottom olympe.df.PONumber | number | olympe.df.Node <optional>
 0

The bottom padding, in pixels.
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setPaddingLeft( [paddingLeft])

Sets the padding, in pixels, to apply to the left of the text in this component.

Parameters:
Name Type Argument Default Description
paddingLeft olympe.df.PONumber | number | olympe.df.Node <optional>
 0

The left padding, in pixels.
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setPaddingRight( [paddingRight])

Sets the padding, in pixels, to apply to the right of the text in this component.

Parameters:
Name Type Argument Default Description
paddingRight olympe.df.PONumber | number | olympe.df.Node <optional>
 0

The right padding, in pixels.
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setPaddingTop( [paddingTop])

Sets the padding, in pixels, to apply to the top of the text in this component.

Parameters:
Name Type Argument Default Description
paddingTop olympe.df.PONumber | number | olympe.df.Node <optional>
 0

The top padding, in pixels.
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setParent(parent)

Sets the parent of this element.

Important: This method must be called when this element is added to a container or layout.

Parameters:
Name Type Description
parent olympe.df.Proxy.<olympe.ui.std.Element> | olympe.ui.std.Element

The parent for this element.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setPlaceholder(placeholder)

Sets the placeholder text that should be displayed when this field is empty.

Parameters:
Name Type Description
placeholder olympe.df.POString | string | olympe.df.Node

Text to display.
Returns:

This TextArea.

Type
olympe.ui.std.TextArea

setPlaceholderColor(color)

Sets the placeholder text color.

Parameters:
Name Type Description
color olympe.df.PColor | olympe.df.Node

The color to use.
Returns:

This TextArea.

Type
olympe.ui.std.TextArea

setPosition(position)

Sets the position (x,y) for this Element.

Parameters:
Name Type Description
position olympe.df.Vector2 | olympe.df.Proxy | olympe.df.Node

The position of this element.
Inherited From:
Overrides:
Returns:

this DockableElement.

Type
olympe.ui.std.DockableElement

setRotationAngle(angle)

Sets the rotation angle (in degree) for this element.

Parameters:
Name Type Description
angle olympe.df.ONumber | number | olympe.df.Node | olympe.df.Proxy

the angle, in degree.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setScale(scale)

Sets the scaling factor for the width and height of this element.

Parameters:
Name Type Description
scale olympe.df.PVector2 | olympe.df.Node

scaling vector (w, h).
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setShadow( [offset] [, radius] [, spread] [, color] [, inset])

Set shadow on this DockableElement. A shadow is defined by its offset, the blur radius, the spread radius (all in pixels) and a base color. A shadow is by default 'external, but can be made internal by setting the 'inset' parameter to true`.

Parameters:
Name Type Argument Default Description
offset olympe.df.Vector2 | olympe.df.Node | olympe.df.Proxy.<olympe.df.Vector2> <optional>
 0

Offset in pixels.
radius olympe.df.PONumber | olympe.df.Node | number <optional>
 0

Blur radius in pixels.
spread olympe.df.PONumber | olympe.df.Node | number <optional>
 0

Spread in pixels.
color olympe.df.Color | olympe.df.Node | olympe.df.Proxy.<olympe.df.Color> <optional>
 '#000000'

Shadow color.
inset olympe.df.POBoolean | olympe.df.Node | boolean <optional>
 false

true if the shadow is inset.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setShadowPSStyle(color, angle, distance, spread, size, inset)

Set shadow on this DockableElement as done in Photoshop.

Parameters:
Name Type Description
color olympe.df.Color | olympe.df.Node | olympe.df.Proxy.<olympe.df.Color>

Shadow Color.
angle olympe.df.PONumber | olympe.df.Node | number

Angle, in radians.
distance olympe.df.PONumber | olympe.df.Node | number

Distance, in pixels.
spread olympe.df.PONumber | olympe.df.Node | number

Spread in pixels.
size olympe.df.PONumber | olympe.df.Node | number

Size, in pixels.
inset olympe.df.POBoolean | olympe.df.Node | boolean

true if the shadow is inset.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setStyle(style, value)

Parameters:
Name Type Description
style string

CSS style name
value string | number

CSS style value
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setTabIndex(tabIndex)

Sets the tab index to this Element. Tab Index defines the tabulation or 'next' order while going through a form.

Parameters:
Name Type Description
tabIndex olympe.df.PONumber | olympe.df.ONumber | number | olympe.df.Node

The tab index.
Inherited From:
Overrides:
Returns:

this Element.

Type
olympe.ui.std.Element

setText(text)

Sets the text of this TextArea to the specified text. If the text is null or empty, has the effect of simply deleting the old text. If the text area is currently being edited by the user, this call is ignored.

Parameters:
Name Type Description
text olympe.df.POString | string

The new text to be set.
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setTextColor(color)

Sets the color to use when displaying the text in this component.

Example:

textArea.setTextColor(olympe.df.Color.red());
Parameters:
Name Type Description
color olympe.df.PColor | olympe.df.Node

The color for the text.
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setTextHorizontalAlign( [horizAlign])

Sets the horizontal alignment (left, center or right) for the text in this field.

Parameters:
Name Type Argument Default Description
horizAlign olympe.ui.common.HorizontalAlign | olympe.df.Node | olympe.df.Proxy <optional>
 left

Horizontal alignment.
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setTextVerticalAlign( [verticalAlign])

Sets the vertical alignment (top, middle or bottom) for the text of this field.

Parameters:
Name Type Argument Default Description
verticalAlign olympe.ui.common.VerticalAlign | olympe.df.Proxy | olympe.df.Node <optional>
 top

Vertical alignment.
Implements:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setThemeClass(themeClass)

Method to override if this dockable element supports themes.

Parameters:
Name Type Description
themeClass olympe.df.POString | olympe.df.Node | string

The theme class.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setTooltip(text [, options])

Assigns a tooltip to that element that will show up when the mouse hovers over it.

Parameters:
Name Type Argument Description
text olympe.df.POString

The text of the tooltip.
options Object <optional>

Various options for displaying the tooltip.

Properties
Name Type Argument Description
position olympe.df.PVector2 <optional>

The absolute position of the tooltip.
background olympe.df.PColor <optional>

The background color.
foreground olympe.df.PColor <optional>

The text color.
fontSize olympe.df.PONumber <optional>

The font size.
borderSize olympe.df.PONumber <optional>

The size of the border. Default is 1.
borderColor olympe.df.PColor <optional>

The color of the border. Default is black.
delay olympe.df.ONumber | number <optional>

The delay, in milliseconds, before showing the tooltip. Default is 500.
startingPos olympe.df.Vector2 <optional>

The starting position of the mouse. Default is (0,0).
theme olympe.df.POString <optional>

The theme class to apply to this tooltip.
Inherited From:
Overrides:
Returns:

This Element.

Type
olympe.ui.std.Element

setUniformScale(scale)

Sets the scaling factor for this element.

Parameters:
Name Type Description
scale olympe.df.PONumber | olympe.df.Node | number

The scaling factor.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement

setValue(value)

Sets the text of this TextArea to the specified text. If the text is null or empty, has the effect of simply deleting the old text. If the text area is currently being edited by the user, this call is ignored.

Parameters:
Name Type Description
value olympe.df.POString | string

New value
Deprecated:
Returns:

this TextArea.

Type
olympe.ui.std.TextArea

setZIndex(zIndex)

Sets the z-index for this element. This determines how elements are layered when they overlap on the screen. Higher Z-index elements are placed on top of lower Z-index elements.

Parameters:
Name Type Description
zIndex olympe.df.PONumber | olympe.df.Node | number

Index of element on z axis.
Inherited From:
Overrides:
Returns:

This DockableElement.

Type
olympe.ui.std.DockableElement