NativeUIModule Overview
NativeUIModule Overview
NativeUIModule Overview

NativeUIModule

Exposes the ability to edit a device's native UI elements including editable text, pickers and sliders.

Each of these require the relevant capability to be enabled under the Native UI Control capability within the project's Properties.

Use of text in your effect, including editable text, is subject to approval policies. See the Editable Text article for more information.

Example

//////////////////////////////////////////////////////////////////////////////
// The following example demonstrates how to get and set the value of
// editable text through scripting and keyboard input.
//
// Project setup:
// - Insert text
// - Set the text to 'Editable' in the inspector
// - Add the 'Editable text' capability under 'Native UI Control'
// - Add the 'Tap Gesture' capability under 'Touch Gestures'
//////////////////////////////////////////////////////////////////////////////

// Load in the required modules
const Diagnostics = require('Diagnostics');
const NativeUI = require('NativeUI');
const TouchGestures = require('TouchGestures');

// Set the initial text value
NativeUI.setText('text0','Default Text');

// Subscribe to tap gestures
TouchGestures.onTap().subscribe(function () {

  // Enter text editing mode
  NativeUI.enterTextEditMode('text0');

});

// Subscribe to changes in the text
NativeUI.getText('text0').monitor().subscribe(function(textUpdate){

  // Log the new text value to the console
  Diagnostics.log('You entered ' + textUpdate.newValue);

});

Properties

PropertyDescription
picker
(get) picker: Picker
(set) picker: Picker


Represents the Picker object in the NativeUI.
The picker object must be configured with the configure() method and its visible property set to true in order to be displayed.
slider
(get) slider: Slider
(set) slider: Slider


Represents the Slider object in the NativeUI.
The slider object will not be displayed unless its visible property is set to true.

Methods

MethodDescription
enterTextEditMode
enterTextEditMode(nodeName: string): Promise<boolean>


Requests text input from the user for the specified object.
* nodeName - the name of the text object to request user input for.
The promise returned is resolved with a boolean value which represents whether the input request was successful.

On a successful input, the nodeName object's text will be updated automatically.
getText
getText(nodeName: string): StringSignal


Returns the user edited text of the nodeName object.
* nodeName - the text object to retrieve the text from.
setText
setText(nodeName: string, text: string): void


Sets the text property of the nodeName object to the value specified by text.
* nodeName - the text object to update.
* text - the string to assign to the nodeName's text property.

Classes

ClassDescription
PickerDescribes an object which controls the behavior of the NativeUI's picker.
Requires the Native UI Control > Picker capability within the project's Properties to be enabled.
SliderDescribes an object which controls the behavior of the NativeUI's slider.
Requires the Native UI Control > Slider capability within the project's Properties to be enabled.

Was this article helpful?