CollectionView Events

onBlur Event

An event that accepts a callback function as an input and executes the functionality defined in the callback function when the widget is blurred.

Syntax

onBlur()

Input Parameters

Callback function

A function that contains the logic to be implemented when the widget is blurred.

Read/Write

Read + Write

Remarks

Assign a null value to the onBlur event of a widget to remove the blur effect on the widget.

Example

 

//This is a generic event that is applicable for various widgets.
/*Here, we have shown how to use the onBlur event for a Button widget. You need to make a corresponding use of the onBlur event for other applicable widgets.*/

frmButton.myButton.onBlur = onBlurCallBack;

function onBlurCallBack(widget) {
    console.log('onBlur event triggered');
}

Platform Availability

Available in the IDE
Available on the Responsive Web platform

onDecelerationStarted Event

This event is triggered only on iOS. It is called when deceleration starts at the end of scrolling.

Syntax

onDecelerationStarted()

Read/Write

Read + Write

Remarks

This event is supported only on iOS

Example



//Sample code to set onDecelerationStarted event callback for CollectionView widget.

frmCollection.myCollection.onDecelerationStarted=deceleratedCallback;

function deceleratedCallback(){
      
   //Write your code here.
}

Platform Availability

iOS

onFocus Event

An event that accepts a callback function as an input and executes the functionality defined in the callback function when the widget is in focus.

Syntax

onFocus()

Input Parameters

Callback function

A function that contains the logic to be implemented when the widget is in focus.

From the V9 Service Pack 7 Fixpack 6 release, the callback function of the onFocus Event contains a new parameter, activeElement. The activeElement parameter specifies the widget that is currently in focus.

Read/Write

Read + Write

Remarks

Assign a null value to the onFocus event of a widget to remove focus from the widget.

Example

 

//This is a generic event that is applicable for various widgets.
/*Here, we have shown how to use the onFocus event for a Button widget. You need to make a corresponding use of the onFocus event for other applicable widgets.*/

frmButton.myButton.onFocus = onFocusCallBack;

function onFocusCallBack(widget, activeElement) {
    console.log('onFocus event triggered');
}

Platform Availability

Available in the IDE
Available on the Responsive Web platform

onItemDisplay Event

This event is triggered when you display any item in the CollectionView widget.

Syntax

onItemDisplay(
     widgetHandle,
     sectionIndex,
     itemIndex,
     itemMdl)

Parameters

widgetHandle

Specifies the current CollectionView widget.

sectionIndex

Specifies the index of the section of CollectionView item

itemIndex

Specifies the index of the clicked item.

itemMdl

Specifies the item Model corresponding to the section index and item index. This parameter is valid only for iOS platform.

Read/Write

Read + Write

Remarks

The onItemDisplay event provides you access to the itemMdl. This itemMdl can be animated by using the itemMdl.animate API. For more information on widget animation, refer the Widget Animation Using Flex Forms section.

Example



function onItemDisplay(widgetHandle, sectionIndex, itemIndex, itemMdl) {
    kony.print("widgetHandle is:" + widgetHandle);
    kony.print("sectionIndex is:" + sectionIndex);
    kony.print("itemIndex is:" + itemIndex);
    kony.print("itemMdl is:" + itemMdl);
}

Platform Availability

Available on all platforms.

onItemSelect Event

This event is triggered when the user selects any item in the CollectionView.

Syntax

onItemSelect (
     Widget,
     sectionIndex,
     ItemIndex)

Parameters

CollectionViewWidget

Reference to the CollectionView widget that raised the event.

SectionIndex

Specifies the index of the section to which the item belongs to.

ItemIndex

Specifies the index of item that has been clicked.

Read/Write

Read + Write

Remarks

This event is not raised if the selectable property in the metainfo is set to false.

In the Android platform, when a gesture or touch events are placed inside the flex template for the CollectionView widget, because of the propagation of events to the below container, the flex template may not receive the onItemSelect event.

Platform Availability

iOS
Android

onKeyPress Event

This event takes a callback as an input that is invoked by the platform when the user presses a key (on the keyboard).

Syntax

onKeyPress(eventObject, eventPayload, context)

Input Parameters

eventObject:

An Object that contains the instance of the widget that triggered the onKeyPress event.

eventPayload:

An Object that contains information about the keyboard interactions. Based on the key that the user presses, the value of the eventPayload varies as follows:

Key	Description
altKey	Returns a boolean value. The value is true when the Alt key (Option key on macOS systems) is pressed.
ctrlKey	Returns a boolean value. The value is true when the Ctrl key is pressed.
shiftKey	Returns a boolean value. The value is true when the Shift key is pressed.
metaKey	Returns a boolean value. The value is true when the meta key ( windows key ⊞ on windows systems, command key ⌘ on macOS systems) is pressed.
capsLock	Returns a boolean value. The value is true when the capsLock key is turned on.
keyCode	Returns the ASCII code of the key pressed .
preventDefault	Returns a function. This function can be invoked to prevent the default action of the widget.

context:

An Object that represents information about the row that contains the target widget that triggered the onKeyPress event.

rowIndex: The index of the row that contains the target widget for a Segment widget.

itemIndex: The index of the row that contains the target widget for a CollectionView widget.

sectionIndex: The index of the section that contains the target widget.

widgetInfo: The widget reference of the Segment or CollectionView widget.

Read/Write

Read + Write

Remarks

The onKeyPress event is not linked with native keypress event, i.e both the events are different.
For widgets (such as TextBox and TextArea) that support both the onKeyDown and onKeyPress events, the onKeyDown event takes higher priority.
If a widget has both the onKeyDown and onKeyPress events configured, the onKeyDown event is invoked first, followed by the onKeyPress event.
The Web Framework provides support for both the onKeyDown and onKeyPress events on the TextBox and TextArea widgets. However, Temenos recommends that you use only one of the events for a widget.

Example



/*This event is triggered in both TextBox and TextArea widgets for Android platform.*/

/*This example demonstrates how to set an onKeyPress event callback to a Button widget that is placed inside form


frmButton.myButton.onKeyPress = onKeyPressCallBack;

function onKeyPressCallBack(eventObject, eventPayload) {
    console.log('onKeyPress event triggered');
}

Platform Availability

Available in the IDE
Available on the Responsive Web platform

onPull Event

An event callback that is invoked by the platform when scrolling the CollectionView widget from it's edges.

Syntax

onPull(JSFlexContainer)

Parameters

JSFlexContainer

Handle to the widget reference.

Read/Write

Read + Write

Remarks

For flow layout:

The views created from these widgets are shown when you pull or push the scrollview container from its edges.

For horizontal layout:

The width of the view is set to the width of the CollectionView.
The height is based on the height configured for the CollectionView Widget. 50dp is the default value.
The view is docked at the extreme end of the CollectionView widget.

For vertical layout:

The height of the view is set to the height of the CollectionView.
The view is docked at the extreme end of the CollectionView widget.

Example



//Sample code to set onPull event callback for CollectionView widget.

frmCollection.myCollection.onPull=onPulleventCallback;

function onPulleventCallback(widgetref){
      
   kony.print("widget reference:" + widgetref);
}

Platform Availability

iOS
Android

onPush Event

An event callback that is invoked by the platform when scrolling the CollectionView widget widget from it's edges.

Syntax

onPush(widgetref)

Parameters

widgetref

Handle to the widget reference.

Read/Write

Read + Write

Remarks

For flow layout:

The views created from these widgets are shown when you pull or push the FlexContainer from its edges.

For horizontal layout:

The width of the view is set to the width of the CollectionView.
The height is based on the height configured for the CollectionView Widget. 50dp is the default value.
The view is docked at the extreme end of the CollectionView widget.

For vertical layout:

The height of the view is set to the height of the CollectionView.
The view is docked at the extreme end of the CollectionView widget.

Example



//Sample code to set onPush event callback for CollectionView widget.

frmCollection.myCollection.onPush=onPusheventCallback;

function onPusheventCallback(widgetref){
      
   kony.print("widget reference:" + widgetref);
}

Platform Availability

iOS
Android

onReachingBegining Event

onReachingBegining gets called when scrolling reaches the beginning of the CollectionView widget.

Syntax

onReachingBegining(CollectionViewWidget,offset)

Parameters

CollectionViewWidget

Handle to the widget reference.

offset

Object containing values for x and y.

Read/Write

Read + Write

Example



//Sample code to set onReachingBegining event callback for CollectionView widget.

frmCollection.myCollection.onReachingBegining=onReachingBeginingCallback;

function onReachingBeginingCallback(widgetref, offset){
      
   kony.print("widget reference:" + widgetref + "and the offset is:" + offset);
}

Platform Availability

iOS
Android

onReachingEnd Event

onReachingEnd gets called when scrolling reaches the end of the CollectionView widget.

Syntax

onReachingEnd(CollectionViewWidget)

Parameters

CollectionViewWidget

Handle to the widget reference.

offset

Object containing values for x and y.

Read/Write

Read + Write

Example



//Sample code to set onReachingEnd event callback for CollectionView widget.

frmCollection.myCollection.onReachingEnd=onReachingEndCallback;

function onReachingEndCallback(widgetref, offset){
      
   kony.print("widget reference:" + widgetref + "and the offset is:" + offset);
}

Platform Availability

iOS
Android

onScrollStart Event

Indicates that the scroll container inside the CollectionView widget started scrolling.

Syntax

onScrollStart (source)

Parameters

source

Specifies the widget on which scrolling started.

Read/Write

Read + Write

Remarks

The onScrollStart event is called asynchronously. The event is triggered only when scrolling is started. When touch does not result to a scroll, this event is not raised.

Example



//Sample code to set onScrollStart event callback for CollectionView widget.

frmCollection.myCollection.onScrollStart =onScrollStartCallback;

function onScrollStartCallback(eventobject){
      
   kony.print("eventobject is:" + eventobject);
}

Platform Availability

iOS
Android

onScrollTouchReleased Event

Indicates that user scrolling touch on the display is released. This callback is called asynchronously.

Syntax

onScrollTouchReleased (source)

Parameters

source

Specify the segment on which scrolling touch is released.

Read/Write

Read + Write

Example



//Sample code to set onScrollTouchReleased event callback for CollectionView widget.

frmCollection.myCollection.onScrollTouchReleased=onScrollTouchReleasedCallback;

function onScrollTouchReleasedCallback(eventobject){
      
   kony.print("eventobject is:" + eventobject);
}

Platform Availability

iOS
Android

onScrolling Event

Indicates that segment scrolling is in progress. This callback is called asynchronously.

Syntax

onScrolling (source)

Parameters

source

Specify the segment on which scrolling is in progress.

Read/Write

Read + Write

Example



//Sample code to set onScrolling event callback for CollectionView widget.

frmCollection.myCollection.onScrolling=onScrollingCallback;

function onScrollingCallback(eventobject){
      
   kony.print("eventobject is:" + eventobject);
}

Platform Availability

iOS
Android

onScrollEnd Event

Indicates that segment scrolling has come to an end.

Syntax

onScrollEnd (source)

Parameters

source

Specify the segment on which scrolling is coming to an end.

Read/Write

Read + Write

Remarks

The onScrollEnd callback is called asynchronously. This event is called only when the scrolling reached end of the scroll.

When multiple scrolls performed on the Segment widget, the onScrollTouchReleased is triggered whenever touch is released, but the onScrollEnd event is triggered only when the entire scrolling is ended. So when the user keeps on flinging on the display, the onScrollTouccReleased callback is triggered multiple times and onScrollEnd is triggered only once.

Example



//Sample code to set onScrollEnd event callback for CollectionView widget.

frmCollection.myCollection.onScrollEnd=onScrollEndCallback;

function onScrollEndCallback(eventobject){
      
   kony.print("eventobject is:" + eventobject);
}

Platform Availability

iOS
Android

onScrollWidgetPosition Event

This event callback is invoked by the platform when the widget location position gets changed on scrolling. The onScrollWidgetPosition event returns the positional coordinates of the widget's location with respect to the screen (screenX and screenY) and the parent container (frameX and frameY). This event is invoked asynchronously, and is not available for FlexForm widget.

Syntax

onScrollWidgetPosition()

Read/Write

Read + Write

Example



var LabelWdg = new kony.ui.Label(basicConf, layoutConf, pspConf);
form.add(LabelWdg);
LabelWdg.onScrollWidgetPosition = onScrollWidgetPositionCallBack;

function onScrollWidgetPositionCallBack(wdg, screenX, screenY, frameX, frameY) { //wdg : Widget that is registered for onScrollWidgetPosition.
    /*screenX : Position of widget with respect to 
the screen's X - coordinates (after downsizing the navigation bar and status bar).*/
    /*screenY : Position of widget with respect to the screen's Y - 
coordinates (after downsizing the navigation bar and status bar).*/
    //frameX : Position of widget with respect to parent container's X- coordinates.
    //frameY : Position of widget with respect to parent container's Y- coordinates.
}

Platform Availability

Not Accessible from IDE
Android
iOS

.CollectionView Events