Нижний слой любого мобильного приложения — это ОС, поверх которой строится все или что угодно. Тогда у нас есть браузеры, на которых мы будем запускать приложения. Это может быть Chrome, Safari, IE что угодно. Верхний уровень стандартов W3, который является общим для всех. Sencha Touch стоит или построен на основе стандартов 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 — основной файл, с которого начнется поток программы. Он должен быть включен в основной файл HTML с помощью тега <script>. Приложение вызывает контроллер приложения для остальной функциональности.
Controller.js — это файл контроллера архитектуры Sencha Touch MVC. Он содержит все элементы управления приложением, прослушиватели событий и большую часть функциональности кода. Он выполняет следующие задачи: маршрутизация, промежуточный между представлением и моделью, и выполняет события.
View.js — содержит интерфейсную часть приложения, которая отображается для пользователя. Sencha Touch использует различные расширенные представления пользовательского интерфейса, которые можно расширять и настраивать в соответствии с требованиями.
Store.js — содержит локально кэшированные данные, которые должны отображаться при просмотре с помощью объектов модели. Store извлекает данные с использованием прокси-серверов, путь к которым определен службами для извлечения внутренних данных.
Model.js — содержит объекты, которые связывают данные магазина для просмотра. Это представление объекта реального мира, которое в основном имеет дело с базой данных.
Utils.js — он не включен в архитектуру MVC, но рекомендуется использовать его, чтобы сделать код чистым, менее сложным и более читабельным. Мы можем написать методы в этом файле и вызывать их в контроллере или в окне визуализации, где это необходимо. Это также полезно для повторного использования кода.