Tuesday 19 November 2013

Various ways of creating component instance in Sencha Touch 2

In sencha touch 2, we can create instance for the component classes in various ways. Let's see each one with example

Option 1:

We can create instance for the sencha touch component classes using the constructor 'new' keyword, similar to creating objects in other Programming languages like (java, PHP). Let's see an example of creating Ext.Img class component instance using 'new' keyword.

var compObj = new Ext.Img({
    src: 'http://domain.com/folder/image.jpg',
    width: 200,
    height: 150
});

Option 2:

We can use Ext.create() method for creating instance for the sencha touch component class. This method will first check whether this classes is loaded or not. if it's not loaded, using Ext.loader() class, first it will load the corresponding class file and then it will instance it. Let's see the above example of creating Ext.Img component instance.

var compObj = Ext.create('Ext.Img',{
    src: 'http://domain.com/folder/image.jpg',
    width: 200,
    height: 150
});

Which one is better?

1) If you are not sure whether the component class is loaded or not, you can use Ext.create() method (option 2)  for creating instance for component.
2) If the component class is loaded before, you can use (option 1) constructor using new keyword in order to create instance for component.

Please let me know, is there any other way of creating component instance in Sencha Touch through the below comments.

Hope, you enjoyed this Post.




No comments:

Post a Comment