Class: TextInput

TextInput

TextInput

new GOWN.TextInput(theme, skinName)

The basic Text Input - based on PIXI.Input. Input by Sebastian Nette, see https://github.com/SebastianNette/PIXI.Input
Name Type Default Description
theme GOWN.Theme optional theme for the text input
skinName String TextInput.SKIN_NAME optional name of the text input skin

Extends

Members

static,readonlyGOWN.TextInput.SKIN_NAMEString

Default text area skin name

allowDestroyCachebool

Will destroy the skin cache when the skinable gets destroyed
Default Value:
  • true

autoPreventInteractionbool

Prevent other interaction (touch/move) on this component
Default Value:
  • false

blinkIntervalNumber

Interval for the cursor (in milliseconds)
Default Value:
  • 500

currentStateString

The current state TODO: move to skinable?
Default Value:
  • InputControl.UP

displayAsPasswordbool

Set display as password (show text with "*")

enabledBoolean

Enables/Disables the control. (not implemented yet)

hasFocusbool

Determine if the input has the focus
Default Value:
  • false

maxCharsString

The maximum number of characters that may be entered. If 0, any number of characters may be entered. (same as maxLength for DOM inputs)
Default Value:
  • 0

receiveKeysbool

TODO
Default Value:
  • true

selectionBgPIXI.Graphics

Text selection background

skinFallbackString

The fallback skin if the other skin does not exist (e.g. if a mobile theme that does not provide a "hover" state is used on a desktop system) (normally the default "up"-state skin)
Default Value:
  • 'up'

skinNameString

The skin name
Default Value:
  • TextInput.SKIN_NAME

stylePIXI.TextStyle

Set the text style (size, font etc.) for text and cursor

textString

Set the text that is shown inside the input field. Calls onTextChange callback if text changes.
Default Value:
  • ''

Methods

Blur the text input (remove focus)

inherited changeSkin(skin)

Remove old skin and add new one
Name Type Description
skin DisplayObject
Delete the selected text

inherited deleteText(fromPos, toPos){String}

Delete text from a start position to an end position
Name Type Description
fromPos Number start position
toPos Number end position
Returns:
Type Description
String
Destroy the Skinable and empty the skin cache
Focus on this input and set it as current

inherited fromSkin(name, callback)

Get image from skin (will execute a callback with the loaded skin when it is loaded or call it directly when it already is loaded)
Name Type Description
name String name of the state
callback function callback that is executed if the skin is loaded

getLines(){Array|*}

Get the text lines as an array
Returns:
Type Description
Array | * Returns an array with one text line per array element
Insert a char at the current cursor position
Name Type Description
char String The char that gets inserted
Height of the line in pixel (assume that every character of pixi text has the same line height)
Returns:
Type Description
Number

inherited mousePos(){PIXI.Point}

Get the local mouse position from PIXI.InteractionData
Returns:
Type Description
PIXI.Point
Move the cursor left
Move the cursor right
Callback that will be executed once the text input is blurred
onDown callback
Callback to execute code on focus

inherited protectedonInputChanged()

Input changed callback

inherited protectedonMouseUpOutside()

Blurs the input when the mouse is released outside
onMove callback
onUp callback

inherited pixelToTextPos(pixelPos){Number}

From pixel position on the text to character position inside the text (used when clicked on the text)
Name Type Description
pixelPos Pixel position of the mouse on the text
Returns:
Type Description
Number Position in the text
Initiate all skins first
Update before draw call (draw cursor and selection)
Set the cursor position on the text
Set the text
Name Type Description
text String The text to display
Change the theme
Name Type Description
theme GOWN.Theme the new theme

inherited textToPixelPos(textPos, position){PIXI.Point}

From position in the text to pixel position (for cursor/selection positioning)
Name Type Description
textPos Number Current character position in the text
position PIXI.Point optional point that will be set with the pixel position and returned
Returns:
Type Description
PIXI.Point Pixel position

inherited textWidth(text){Number}

Get the width of a text
Name Type Description
text String The text to get the width from
Returns:
Type Description
Number

inherited updateSelection(start, end){boolean}

Set the selected text
Name Type Description
start Number Start position in the text
end Number End position in the text
Returns:
Type Description
boolean

inherited updateTheme(data)

Overwrite data from theme for this specific component. (usable if you want to change e.g. background color based on selected items)
Name Type Description
data updated skin data