Options
All
  • Public
  • Public/Protected
  • All
Menu

The Avatar component is a virtual person interface. It is similar to the Animation component but it has the ability to move the mouth of the animation in sync with a voice file. It has a Speech Component inside it to handle making the Avatar speak.

var uComps = require('u-components');
var uActions = require('u-actions');
var Action = uActions.Action;
new Action('Avatar Trial', avatarTrial)
.addParameter('Animation', uActions.ParamType.AVATAR)
.register();
function avatarTrial(comp) {
var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.filename = 'spineboy/spineboy.atlas'
avatarComp.animationDefault = 'aim'
avatarComp.scale = 0.4
avatarComp.animationOriginX = 0.8
avatarComp.animationOriginY = 0.1
avatarComp.delay = 500
avatarComp.animationPress = 'hoverboard'
avatarComp.speak('This is a short sentence to test the speaking ability of the avatar', true)
}

Hierarchy

Index

Constructors

Properties

alpha: number

The alpha transparency of the Component. Range from 0 to 100.

animation: string

Name of the current animation. - Read Only

var avatarComp = uComps.cast.toAvatar(comp);
var currentAnimation = avatarComp.animation;
animationDefault: string

The default animation that shows when the component shows.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.animationDefault = 'Run';
animationOriginX: number

Set the horizontal position.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.animationOriginX = 0.5;
animationOriginY: number

Set the vertical position.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.animationOriginY = 0.2;
animationPress: string

The animation to play when this component is pressed.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.animationPress = 'Jump';
animations: string[]

List of animation names contained in the current animation file. - Read Only

new Action('Avatar Display', avatarDisplay)
.addParameter('Animation', uActions.ParamType.AVATAR)
.addParameter('Text', uActions.ParamType.TEXT)
.register();
function avatarDisplay(comp, comp2) {
var avatarComp = uComps.cast.toAvatar(comp);
var textComp = uComps.cast.toText(comp2);
for (var i = 0; i < avatarComp.animations.length; i++) {
var animationName = avatarComp.animations[i];
textComp.text += animationName + '\r\n'
}
}
clippingType: ClippingType

Clip the components contents using one of the options in ClippingType.

components: ComponentList

Access this Component's sub-components.

delay: number

Delay the default animation from playing by a millisecond amount.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.delay = 500;
filename: string

Relative path to the animation .atlas file within the ./animation folder of your project. To see the avatar animation, the animationDefault often also needs to be set.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.filename = 'person/person.atlas';
avatarComp.animationDefault = 'Idle';
formEnabled: boolean

Whether or not is component is enabled for the parent form. Only relevant when inside a Form Component.

formFieldName: string

Label used to identify the field this Component belongs to in a form. Only relevant when inside a Form Component.

height: number

The height of the Component.

length: number

Length of the current animation in milliseconds. - Read Only

var avatarComp = uComps.cast.toAvatar(comp);
var len = avatarComp.length;
loop: boolean

Should the default animation loop.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.loop = true;

Shape component to be used as a mask. Can be either a Rectangle or Circle Component.

mouthSlotname: string

Name of bone in the animation the represents the mouth part of avatar animation.

var avatarComp = uComps.cast.toAvatar(comp);
var slotName = avatarComp.mouthSlotname;
name: string

Name of the component.

parent: Component

Access this Component's parent component.

passedFormValidation: boolean

Whether or not the Component has passed form validation. Only relevant when inside a Form Component.

scale: number

The scale to render the animation at. Default is 1.

var avatarComp = uComps.cast.toAvatar(comp);
avatarComp.scale = 0.4;

The current state of the animation - Read Only

var avatarComp = uComps.cast.toAvatar(comp);
var currentState = avatarComp.state;
time: number

Position of current animation in milliseconds.

var avatarComp = uComps.cast.toAvatar(comp);
var currentTime = avatarComp.time;
type: string

Type of the component.

uniqueId: string

Unique ID of the component.

visible: boolean

Whether or not the Component is visible.

width: number

The width of the Component.

x: number

The x position of the Component relative to its parent.

y: number

The y position of the Component relative to its parent.

Methods

  • emit(eventType: string, data: Object): void
  • Call each callback that is registered for the given eventType, in the order they were registered, passing the supplied data to each.

    Parameters

    • eventType: string

      The type of the event to emit.

    • data: Object

      Data object to pass to each callback.

    Returns void

  • focus(): void
  • Set the keyboard focus to this component.

    new uActions.Action('set focus', setFocus)
    .addParameter('text entry',uActions.ParamType.TEXT_ENTRY)
    .register();
    function setFocus(textEntry) {
    textEntry.focus();
    }

    Returns void

  • get(propertyName: string): any
  • Get a property by name.

    var uActions = require('u-actions');
    new uActions.Action('get fontsize',getFontSize).register();
    function getFontSize() {
    var text1=uPages.current.components.getText('Text 1');
    console.log(text1.get('font_size'));
    }

    Parameters

    • propertyName: string

      The name of the property to get.

    Returns any

    Returned value can be of any type, or even null.

  • on(eventType: string, callback: Function): void
  • Adds the callback function to the end of the listeners array for eventType.

    Parameters

    • eventType: string

      The type of the event.

    • callback: Function

      The callback function

    Returns void

  • refresh(): void
  • Refresh this component to force it to be re-rendered, or for its dynamic data to be updated.

    Returns void

  • set(propertyName: string, value: any): void
  • set(data: Object): void
  • Set a properties value by name.

    var uActions = require('u-actions');
    new uActions.Action('set text color',setTextColor).register();
    function setTextColor() {
    uPages.get('follow').components.getText('Text 1').set('font_color','0x0000FFFF');
    }

    Parameters

    • propertyName: string

      The name of the property to set.

    • value: any

      The value to set. Can be of any type.

    Returns void

  • Set a number properties at once.

    Parameters

    • data: Object

      Data object containing property name and value pairs to set on this component.

    Returns void

  • speak(message: string, disableSyntheticAudio: boolean): void
  • Translate text into speach.

    var avatarComp = uComps.cast.toAvatar(comp);
    avatarComp.speak('This is a short sentence to test the speaking ability of the avatar', true)

    Parameters

    • message: string

      Text to be spoken.

    • disableSyntheticAudio: boolean

      Sets whether to use the speech component.

    Returns void

  • stop(): void
  • Stop the currently playing animation.

    ``` var avatarComp = uComps.cast.toAvatar(comp); avatarComp.stop();

    Returns void

  • tween(seconds: number, params: Object, type?: TweenType): void
  • Tween a component property over time.

    Parameters

    • seconds: number

      The number of seconds to tween for.

    • params: Object

      An objects that contains key/value pairs of the properties and values to tween.

    • Optional type: TweenType

      (Optional) Tween type can be any type from "Tween.type"

    Returns void