Olympe SDK

Class: Label

olympe.ui.std. Label

A display area for a short text string. A label does not react to input events. As a result, it cannot get the keyboard focus.

Example:

const label = new olympe.ui.std.Label();
label.setText('Hello world!')
     .setPosition(new Vector2(120, 52))
     .setFontSize(20)
     .setFontWeight(30);

new Label( [dimension] [, themeClass])

Creates an instance of Label. If the dimension is omitted then both the height and width of the label will automatically be adjusted to match the content (text) of the label.

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

The initial dimension for this Label.
themeClass olympe.df.POString | string <optional>

The class name to use from the current theme.
Implements:

Extends

Methods

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

<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

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> getUIProxyLabel()

Returns:

Proxified UI object text area

Type
olympe.uiapi.std.Label

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

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

setAutoHeight( [autoHeight])

Sets whether the height of this component should be calculated automatically based on the text and layout constraints. Important Note: This method must be called only after the component has been added to a layout.

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

true to have the height automatically adjusted to the content.
Returns:

This label.

Type
olympe.ui.std.Label

setAutoWidth( [autoWidth])

Sets whether the width of this component should be calculated automatically based on the length of the text and layout constraints. Important Note: This method must be called only after the component has been added to a layout.

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

true to have the width automatically adjusted to the content.
Returns:

This label.

Type
olympe.ui.std.Label

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

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 label. If a font name contains white spaces, it should be put between quotes.

Example:

label.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 label.

Type
olympe.ui.std.Label

setFontSize(fontSize)

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

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

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

This label.

Type
olympe.ui.std.Label

setFontStyle(fontStyle)

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

Example:

label.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 label.

Type
olympe.ui.std.Label

setFontWeight(fontWeight)

Sets the font weight to use when displaying text for this label. 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 label.

Type
olympe.ui.std.Label

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

setLineHeight(lineHeight)

Sets the line height to use when displaying text in this label. Some common values are:

  • 1: There is no extra space between lines.
  • 1.25: Considered 'tight', there is minimal space between lines.
  • 1.5: This is the 'normal' setting.
  • 2: Considered 'loose'. Lines are wide apart.
Parameters:
Name Type Description
lineHeight olympe.df.PONumber | number | olympe.df.Node

Height of each line of text in pixel.
Returns:

This label.

Type
olympe.ui.std.Label

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

Bottom padding, in pixels.
Returns:

This label.

Type
olympe.ui.std.Label

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

Left padding, in pixels.
Returns:

This label.

Type
olympe.ui.std.Label

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

Right padding, in pixels.
Returns:

This label.

Type
olympe.ui.std.Label

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

Top padding, in pixels.
Returns:

This label.

Type
olympe.ui.std.Label

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

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

setSelectable(select)

Sets whether this label is user-selectable or not. When set to true this means the user can select all or part of the text in the label for copy/paste operations. By default this is set to false.

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

true to make this Label user-selectable.
Returns:

This label.

Type
olympe.ui.std.Label

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 that will appear in the label. The following HTML tags are supported and will be interpreted: <b>, </b>, <br>, <br/>, <i>, </i>, <s>, </s>, <sub>, </sub>, <sup>, </sup>, <u>, </u>.

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

Text of this label.
Implements:
Returns:

This label.

Type
olympe.ui.std.Label

setTextColor(textColor)

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

Example:

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

The text color.
Implements:
Returns:

This label.

Type
olympe.ui.std.Label

setTextHorizontalAlign( [horizAlign])

Sets the horizontal alignment (left, center or right) for the text of this label.

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

Horizontal alignment.
Implements:
Returns:

This label.

Type
olympe.ui.std.Label

setTextOverflow( [overflow])

Set how the whether the text end should be replaced with ellipsis marker '...' when it overflows the label width. If not using ellipsis on overflow, the label text is truncated.

Parameters:
Name Type Argument Default Description
overflow olympe.df.POString | string | olympe.df.Node <optional>
 'clip'
Returns:

This label.

Type
olympe.ui.std.Label

setTextVerticalAlign( [verticalAlign])

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

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

Vertical alignment.
Implements:
Returns:

This label.

Type
olympe.ui.std.Label

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 label

Type
olympe.ui.std.Label

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

setWrapWhiteSpaces( [wrap])

Sets whether white spaces should be wrapped to the next line when necessary. If set to false (the default), white spaces are ignored when wrapping the text so the next line always starts with a non white character.

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

true if white spaces must be wrapped.
Returns:

This label.

Type
olympe.ui.std.Label

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