Kony Visualizer Form LifeCycle

 In Kony framework the basic unit of user interface is a form over which widgets and components are aligned. The events of form life cycle are triggered in the following order:

1. onNavigate: This is the first event function that is invoked once a form is navigated. It is invoked automatically if it is implemented in the form controller.
2. init: init event is invoked in second order and it is invoked only first time when a form is loaded. It initializes the form and any widgets.
3. preShow: This event is executed in third order. It is called just before a form is visible on the screen. A form can be made visible by explicitly calling the show method of the form.
4. postShow: postShow event is called in fourth step when form is loaded. It is called immediately after the form is visible on the screen.

Refer to the sample code below of a form controller for implementation of the above lifecycle methods:

define({ 

     init: function(){

       //2- init event is called in second step

       //Called only firsttime when form is loaded

       alert('hello world: init');

       this.view.btnClick.onClick = this.buttonClick;

     },

  

     onNavigate: function(){

       //1- onNavigate event is called in first step when form is loaded 

       //It is called automatically if implemented.       

       alert('hello world: onNavigate');

       this.view.init = this.init.bind(this);

       this.view.preShow = this.onPreShow.bind(this);

       this.view.postShow = this.onPostShow.bind(this);         

     },

     

     onPreShow: function(){

       //2- preShow event is called in third step when form is loaded

       alert('hello world: preshow');

     },

     onPostShow: function(){

       //4- postShow event is called in fourth step when form is loaded

       alert('hello world: postshow');

     },

    

     buttonClick: function(){

       var scopeObj = this;

       scopeObj.view.lblText1.text = "Hello world";

     }

 });