The alpha transparency of the Component. Range from 0 to 100.
Clip the components contents using one of the options in ClippingType.
Access this Component's sub-components.
Mode to display image. uComps.CropMode: 0 - FILL, 1 - FIT FILL: Aspect ratio maintained while filling the entire image component space. FIT: Aspect ratio maintained while restrained by either horizontal, or vertical image component boundary.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.cropMode = uComps.CropMode.FILL;
When false, users are unable to zoom the image with gestures or mouse events. Zoom buttons still work.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.disableZoom = true;
Filename of the first image in a directory to display in the Gallery.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.filename = 'rooms/studio_unit.jpg';
Whether or not is component is enabled for the parent form. Only relevant when inside a Form Component.
Label used to identify the field this Component belongs to in a form. Only relevant when inside a Form Component.
The height of the Component.
When looping is set to true, the first image will display again after the final image in the directory.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.looping = true;
Shape component to be used as a mask. Can be either a Rectangle or Circle Component.
Name of the component.
When looping is set to false, this property determines what should happen to the buttons when the first or last image in the directory is displayed. uComps.NavigationOption: 0 - DO_NOTHING, 1 - DISABLE_BUTTONS, 2 - HIDE_BUTTONS
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.navigationOption = uComps.NavigationOption.DISABLE_BUTTONS;
Access this Component's parent component.
Whether or not the Component has passed form validation. Only relevant when inside a Form Component.
Enable/disable the First Button
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.showButtonFirst = true;
Enable/disable the Last Button
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.showButtonLast = true;
Enable/disable the Next Button
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.showButtonNext = true;
Enable/disable the Previous Button
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.showButtonPrevious = true;
Enable/disable the Zoom to Fullsize and Zoom to Fit buttons
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.showButtonZoomFullFit = false;
Enable/disable the Zoom In and Zoom Out buttons
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.showButtonZoomInOut = false;
Type of the component.
Unique ID of the component.
When true, the user cannot scroll past the edge of the first or last image.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.useHardEdges = false;
When true, gallery images will transition vertically.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.vertical = false;
Whether or not the Component is visible.
The width of the Component.
The x position of the Component relative to its parent.
The y position of the Component relative to its parent.
Call each callback that is registered for the given eventType
, in the order they were registered, passing the supplied data
to each.
The type of the event to emit.
Data object to pass to each callback.
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();
}
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'));
}
The name of the property to get.
Returned value can be of any type, or even null.
Navigate to the first image in the gallery's directory
Navigate to the last image in the gallery's directory
Navigate to the next image in the gallery's directory
Navigate to the previous image in the gallery's directory
Adds the callback
function to the end of the listeners array for eventType
.
The type of the event.
The callback function
Zoom to a specified position.
Zoom level. Range 0 to 4.
Horizontal position. Range 0 to 1.
Vertical Position. Range 0 to 1.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.pan(1, 0.5, 0.2);
Refresh this component to force it to be re-rendered, or for its dynamic data to be updated.
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');
}
The name of the property to set.
The value to set. Can be of any type.
Set a number properties at once.
Data object containing property name and value pairs to set on this component.
Set a folder of images for the gallery component to display.
Name of the folder from within the images directory.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.setFolder('rooms');
Tween a component property over time.
The number of seconds to tween for.
An objects that contains key/value pairs of the properties and values to tween.
(Optional) Tween type can be any type from "Tween.type"
Zoom to fit the image within the gallery component's boundaries.
Zoom in to display the full-sized image.
Zoom in on the image.
Zoom out on the image.
Zoom to a specified zoom level.
Zoom level. Range 0 to 4.
var galleryComp = uComps.cast.toGallery(comp);
galleryComp.zoomTo(2);
Once a Gallery Component has been added to the page from the Component selector, the Gallery Component can be passed as a parameter to actions. Code within the action can set properties and call methods on the Gallery Component.