Difference between Ext.setup(), Ext.application() and Ext.regApplication()

[Joz Michael]

I am a newbie for Sencha touch 2.0 and just footed in this.

Could Some one Explain the difference between Ext.setup(), Ext.application() and Ext.regApplication().

In few Examples i am seeing Ext.application(), and in few Ext.regApplication(). When Googling on these i found something new, Ext.setup().

Could Some one explain difference between them and scenarios to use respective function...

Thanks in advance.

[Jacky Nguyen]

Ext.regApplication() is deprecated in favor of Ext.application()

Ext.setup() is the entry-point to initialize the application, including but not limited to the viewport, the event system, animation runner, logger, etc.

Ext.application() calls Ext.setup() behind-the-scene and pass whatever config you give to Ext.setup(). The only thing extra Ext.application() does is to require and create an instance of Ext.app.Application to initialize the MVC structure. The reason why some examples use Ext.setup() instead of Ext.application() is because they are tiny code snippets to demo a certain view, and doesn't need MVC at all.

Bottom line: for your applications, always use Ext.application()

[Joz Michael]

Hi Jacky,

Thanks for your response...

I used Sencha touch 2.0 and tried a small code snippet.

Ext.application({
launch: function(){
var myPanel = Ext.create("Ext.Panel",{
html: "HELLO"
});
Ext.Viewport.add(myPanel);
}
});

This Works Fine... Displays Text in Browser(Google Chrome 18.0)... But,

Ext.regApplication({
launch: function(){
var myPanel = Ext.create("Ext.Panel",{
html: "HELLO"
});
Ext.Viewport.add(myPanel);
}
});

(or)


Ext.setup({
launch: function(){
var myPanel = Ext.create("Ext.Panel",{
html: "HELLO"
});
Ext.Viewport.add(myPanel);
}
});

NOT WORKING......!!! :-(

Displays Nothing in Browser(Google Chrome 18.0).

Thanks in advance... :-)

[Jacky Nguyen]

As I said Ext.regApplication() is deprecated, don't use it anymore.

Ext.setup() invokes the given 'onReady' property, not 'launch'. 'launch' is Ext.app.Application specific.

Ext.setup({
    onReady: function(){
        // ...
    }
})

[Joz Michael]

Thanks Jacky....

That helped so much for a Clear Start for App development... :-)

Now i am quite comfortable to build a layout... I need to Change the styles, (ie) color, icons, gradients, background image. Can u plz help me on this...

[wvillegasm@me.com]

Jacky Nguyen, I really appreciate your explanations, you help me too!

[waranwin]

Hi Jacky,

Thanks for your response...

I used Sencha touch 2.0 and tried a small code snippet.

Ext.application({
launch: function(){
var myPanel = Ext.create("Ext.Panel",{
html: "HELLO"
});
Ext.Viewport.add(myPanel);
}
});

This Works Fine... Displays Text in Browser(Google Chrome 18.0)... But,

Ext.regApplication({
launch: function(){
var myPanel = Ext.create("Ext.Panel",{
html: "HELLO"
});
Ext.Viewport.add(myPanel);
}
});

(or)


Ext.setup({
launch: function(){
var myPanel = Ext.create("Ext.Panel",{
html: "HELLO"
});
Ext.Viewport.add(myPanel);
}
});

NOT WORKING......!!! :-(

Displays Nothing in Browser(Google Chrome 18.0).

Thanks in advance... :-)

But In my case regApplication is working and Ext.application is not working... And I m unable to create sample panel..hye please any one help me