Skip to content

SegmentedUI Objects

The following objects are used with the SegmentedUI widget.

animation Object

Contains the definition of an animation.

Syntax


animation={definition:defObject, config:{}, callbacks:{}}

Members

definition

An object that specifics which operations (translate, rotate, or scale) are performed by the animation.

config

An animation configuration object that contains the duration and fill mode of the animation.

callbacks

Optional. One or more callback functions.

Example


var transfromObject = voltmx.ui.makeAffineTransform();
transfromObject.translate(10, 0);
transfromObject.scale(0.1, 1);
animationDef = {
    100: {
        "transform": transfromObject
    }
}
animationConfig = {
    duration: 0.3,
    fillMode: voltmx.anim.FILL_MODE_FORWARDS
}
animationDefObject = voltmx.ui.createAnimation(animationDef);
animation = {
    definition: animationDefObject,
    config: animationConfig
}
form.segments.addAt(data, sectionIndex, rowIndex, animation);

animationConfiguration Object

Contains the configuration specification of an animation.

Syntax


animationConfig={duration: <d>,fillMode: <f>}

Members

A floating point number that specifies the time length of the animation.

A value from the set of voltmx.anim.FILL_MODE* that specifies the fill mode.

Example


animationConfig = {
    duration: 0.3,
    fillMode: voltmx.anim.FILL_MODE_FORWARDS
}

animationContext Object

Specifies the section and row index of the animation.

Syntax


animationContext={sectionIndex=<s>,rowIndex = <r>}

Members

sectionIndex

An integer value that specifies the section number.

rowIndex

An integer value that specifies the row number.

Example


contextDef1 = {
    sectionIndex=0,
    rowIndex = 1,
}

transformationObject Object

Defines the transformations to be performed during the animation of a widget in a Segment row.

Members

translate(x,y)

A method that sets the x and y values of the translation to be performed during the animation. When applied to a widget, the widget will be moved x in the horizontal direction and y in the vertical direction.

scale(x,y)

A method that sets the x and y values of the scale operation. When applied to the widget, the width of the widget will be scaled by x and the height will be scaled by y.

rotate(angle)

A method that sets the angle of rotation for the animation.

Remarks

To create a transformationObject, call the voltmx.ui.makeAffineTransform function.

Example


var transformObject = voltmx.ui.makeAffineTransform();
transformObject.translate(10, -5);
transformObject.scale(0.5, 2.0);
transformObject.rotate(10);