Gnanasuriyan

 In Sencha Touch, we can include our application start up logic into following places, this is depending on our application situation.  1. Application default launch function. This launch function is triggered when all the dependencies are loaded successfully.  2. Controller init function.  3. Controller launch function.  4. Profile launch function.  Now I am going to include some code into all the places. Let's see what will happen.  I have created simple controller called "TestController" as shown in figure and I simply printed different message in both init and launch function.  I have created the simple profile called "TestProfile" and I simply printed message in launch function. By default this profile is active.  Now I am going to include my controller and profile into app.js and I am going to simply print different message in application launch function. This is my app.js code.  Ok let's create an in...

 Hi, This video will help you to create a tab panel in sencha touch application. Here  you can download source code of the entire application.

 Sencha allow developers to easily develop MVC based mobile application. Now I am going to explain the steps for creating custom views in sencha application. Before going to start, see my previous post for understanding the folder structure of sencha touch application ( here ).  Inside the view folder I am going to create a MyView.js file with following code. Ext.define('SenchaDemo.view.MyView',{ extend : 'Ext.Panel', xtype : 'myview', config : { fullscreen : true, html : 'This is my own view' } });  Here I have extended a Panel class and included a simple html content, whenever it's render, it's says "This is my own view". The "SenchaDemo.view.MyView" have special meanings.     1. The " SenchaDemo " refer my application name.     2. The " view " refer the view folder present in app folder.     3. " MyView " is my view name.    ...

   Create a new sencha touch application with necessary files and modify the app.js file using following code. If you want to know about application structure, then follow my older post. Ext.application({     name : 'carouselDemo' ,     requires : [ 'Ext.carousel.Carousel' ],     launch : function () {          var horizontalCarouselItems = [];          for ( var i=0;i<5;i++) {            var tempItems = [];            for ( var j=0;j<10;j++) {            tempItems.push({            html : "<h3> Screen number: (" + i + "," + j + ")     </h3>"       });     }     horizontalCarouselItems.push({          xtype : 'carousel' ,         ...

1. Download the latest SenchTouch2.0 library from following location.           http://www.sencha.com/products/touch/download 2. Create a one new root folder and name it is “app”. 3. Create a “js” folder inside the “app” folder and copy the "sencha-touch-all.js" file from downloaded library and paste it into “js” folder. 4. Create a “css” folder inside the “app” folder and copy the “sencha-touch.css” file from downloaded library and paste it into “css” folder. 5. Create "app.js" file into inside the app folder and paste the following code. Ext.application({  name : 'HCarousel',  requires : ['Ext.carousel.Carousel'],  launch : function() {   Ext.Viewport.add({   xtype : 'carousel',   direction : ' horizontal ',   fullscreen : true,            items :  [{                  html : 'Panel 1', ...

 Sencha touch is a OOP java script library used for creating HTML5 based mobile application, that run on mobile like Android, iPhone and Blackberry and give native app-work experience (Just like a JQuery Mobile).  Use below link for downloading secha touch library.        http://www.sencha.com/products/touch/download Sencha development - Basic folder structure. 1. Create a new web project using eclipse or STS. 2. Inside the web content folder, create a new folder called as 'sencha'. 3. Extract the sench library and copy the entire resources folder into 'sencha' directory. 4. Copy the 'sencha-touch-all.js' from Sencha library and put it into 'sencha' directory too. 5. Inside the web content folder, create one more  folder called 'app'. Inside into this folder, you have create model, view, controller, store and profile folders. Here only you need to put all your sencha related  JavaScript  files. 6. Inside the web c...