Sencha Touch - 建筑

---

任何移动应用程序的底层都是操作系统，任何东西都构建在操作系统之上。然后我们就有了运行应用程序的浏览器。它可以是 Chrome、Safari、IE 等任何东西。上层是W3标准，这是大家通用的。Sencha Touch 建立在 W3 标准之上，而 W3 标准只不过是 HTML5，它使得单个应用程序能够兼容不同设备的不同浏览器。

Sencha Touch 是三个框架的组合 - ExtJs、JqTouch 和 Raphael（矢量绘图）。它遵循MVC架构。MVC 将代码分成更易于管理的块。

尽管该架构对于程序来说不是强制性的，但是遵循此结构是最佳实践，以使您的代码具有高度可维护性和组织性。

Sencha Touch 应用程序的项目结构

----------src
----------resources
-------------------CSS files
-------------------Images
----------JavaScript
--------------------App Folder
-------------------------------Controller
------------------------------------Contoller.js
-------------------------------Model
------------------------------------Model.js
-------------------------------Store
------------------------------------Store.js
-------------------------------View
------------------------------------View.js
-------------------------------Utils
------------------------------------Utils.js
--------------------------------app.js
-----------HTML files

Sencha Touch 应用程序文件夹将驻留在项目的 JavaScript 文件夹中。

该应用程序将包含带有 app.js 的控制器、视图、模型、存储和实用程序文件。

app.js - 程序流程开始的主文件。应使用 <script> 标记将其包含在主 HTML 文件中。应用程序调用应用程序的控制器来实现其余功能。

Controller.js - 它是 Sencha Touch MVC 架构的控制器文件。它包含应用程序的所有控制、事件侦听器以及代码的大部分功能。它执行以下任务：路由、视图和模型之间的中介以及执行事件。

View.js - 它包含向用户显示的应用程序的界面部分。Sencha Touch使用各种UI丰富的视图，可以根据需求进行扩展和定制。

Store.js - 它包含本地缓存的数据，这些数据将在模型对象的帮助下呈现在视图上。Store 使用代理来获取数据，代理为服务定义了获取后端数据的路径。

Model.js - 它包含将商店数据绑定到视图的对象。它是现实世界对象的表示，基本上与数据库打交道。

Utils.js - 它不包含在 MVC 架构中，但使用它是最佳实践，以使代码干净、不那么复杂且更具可读性。我们可以在此文件中编写方法，并在需要时在控制器或视图渲染器中调用它们。它对于代码可重用性也很有帮助。