- Sencha Touch Cookbook
- Ajit Kumar
- 405字
- 2021-08-20 15:56:07
Initializing your application
So far, we have been using Ext.setup
to enter into our application, where the entry point is provided by the onReady
method, which is invoked when the document is ready. However, in an enterprise setup, an application is much more complex and needs more configurations that that which Ext.setup
provides. For example, if you would like to configure your application with the history support, rather than doing it for individual pages or components, you may like your application to configure it based on the target platform and many more. These kinds of needs are addressed by Sencha Touch by providing a dedicated class.
Sencha Touch provides an Ext.Application
class to create an application. This is a convenient way to create an application. Besides configuring your application, this class also allows you to structure your complete application in the form of Model-View-Controller and initialize it using a convenient method. The class allows the user to implement a function, which can be called when the application is launched. In this recipe, we will see how to create and initialize an application using the Ext.Application
class.
How to do it...
Carry out the following steps:
- Create and open a new file
ch01_04.js
in thech01
folder and paste the following code into it:new Ext.Application({ name: 'MyApp', launch: function() { this.viewport = new Ext.Panel({ fullscreen: true, items : [ { html: 'Welcome to My App!' } ] }); } });
- Remove the following line from
index.html
:<script type="text/javascript" charset="utf-8" src="ch01/ch01_03.js"></script>
- Include the following line in
index.html
:<script type="text/javascript" charset="utf-8" src="ch01/ch01_04.js"></script>
- Deploy and run the application.
How it works...
Ext.Application
provides various configuration options, which can be specified while constructing the Application
instance. The name
property provides the application name, which is also used as the namespace for the application being initialized. In addition, by default, the following namespaces are registered using the name
property value:
MyApp.models
MyApp.views
MyApp.controllers
MyApp.stores
Another property is launch
. The launch
function creates the application's viewport and runs any actions the application needs to perform when it boots up. The launch
function is run once. In the preceding code, we are creating a panel in the full screen mode which will show Welcome to My App! in its body.
See also
The recipe named Setting up browser-based development environment in this chapter.
- Designing Machine Learning Systems with Python
- AngularJS Testing Cookbook
- DevOps with Kubernetes
- Python自然語言處理(微課版)
- Learning Laravel 4 Application Development
- Unity Shader入門精要
- Python機器學習算法與實戰
- C和C++游戲趣味編程
- Visual Basic 6.0程序設計實驗教程
- Lift Application Development Cookbook
- 算法設計與分析:基于C++編程語言的描述
- 高效使用Greenplum:入門、進階與數據中臺
- Python編程快速上手2
- Mastering Machine Learning with R
- 高性能MVVM框架的設計與實現:San