Как организовать JS файлы в проекте Apcelerator Titanium

Недавно я начал создавать приложение iPhone с помощью Appcelerator Titanium. Поскольку приложение - это, по сути, все JS, мне нужны были некоторые советы о том, как я должен организовать этот проект.

Очень просто создавать длинные процедурные файлы для каждого вида приложения. Есть ли способ включить MVC или некоторую структуру в проект?

Спасибо, я ценю это. -Tilo

Ответы

Ответ 1

Титан сам по существу является MVC, учитывая, что ваш файл app.js является основным контроллером, и каждый вид, который вы создаете, представляет собой представление, и вы передаете (или задаете) данные модели против представления.

В Titanium вы можете разложить свое приложение с помощью нескольких хороших встроенных механизмов:

  • Titanium.include - Titanium.include позволяет включать один или несколько файлов JS на место, как C #include директива компилятора. Вы можете поместить в этот файл общие функции и классы JS, а затем включить их там, где хотите, чтобы они были импортированы и доступны.

  • Titanium.UI.createWindow - вы можете создать новый вид как как свойство нового прохода окна в URL-адресе другому JS, который создаст новый подконтекст JS и позволит вам сохранить свое собственное пространство переменных (но все же даст вам доступ к вашему родителю).

Кроме того, в Titanium вы можете создавать папки, которые позволят вам логически организовывать ваше приложение таким образом, который подходит вам и вашему приложению.

Изменить: Сегодня метод Titanium.Include устарел. Как упоминалось в документации, мы должны создать модуль CommonJS и использовать оператор require().

Дополнительная информация об этом утверждении: Require

Дополнительная информация о модулях: Modules

Ответ 2

Поскольку я не нашел подходящего решения MVC для мобильного проекта Titanium, я придумал следующий подход. Для небольших приложений это может быть чрезмерно спроектировано, но может помочь поддерживать растущие приложения.

Структура папки:

/Resources
  /model
  /view
  /controller
  /ui
  /iphone
  /android
  app.js
  app.jss

Для разделения представлений, моделей и контроллеров требуется пространство имен, поэтому мы определяем его в app.js, который является нашим основным контроллером:

var app = {
  view: {},
  controller: {},
  model: {},
  ui: {}
}

В папках мы помещаем отдельные файлы JavaScript для каждого компонента. Для этого мы могли бы использовать легкую библиотеку OOP для JavaScript, такую ​​как MooTools или Prototype, или определить простые функции JS как наши объекты. Если вы также хотите наследовать родительские классы, библиотека определенно имеет смысл.

Примеры:

# Resources/controller/MyController.js
app.controller.MyController = function() {
   return {
      getView: function() {
         return new app.view.MyView().getView();
      }
   }
}

# Resources/view/MyView.js
app.view.MyView = function() {
   return {
      getView: function() {
         return Ti.UI.createWindow({...});
      }
   }
}

# Resources/view/MyModel.js
app.model.MyModel = function() {
   return {
      some: "data",
      foo: "bar"
   }
}

После этого мы можем включить в файл app.js все необходимые классы модели/представления/контроллера с Ti.include() и ссылаться на компоненты с нашим пространством имен:

Ti.include("controller/MyController.js");
Ti.include("view/MyView.js");
var myController = new app.controller.MyController();
var myView = myController.getView();
myView.open();

Подход MVC теперь предполагает, что контроллер "контролирует" состояние представления и передает данные из модели в представление. Представление состоит только из элементов интерфейса и свойств для стилизации. Любое действие, выполняемое в пользовательском интерфейсе, вызывает событие, которое сообщает контроллеру выполнить требуемое действие.

Но, конечно, точное определение MVC может отличаться в зависимости от вашего личного вкуса;)

Ответ 3

Это также может помочь: Основная структура организации мобильного проекта Titanium: https://github.com/krawaller/Struct

Ответ 4

Позвольте мне обновить этот вопрос, так как большинство ответов заменяются. В четвертом квартале 2012 года Appcelerator выпустила платформу Alloy MVC (бета) вместе с последней версией IDE и SDK, Titanium Studio 3.0 и SDK 3.0. Сплав полностью интегрирован с Studio, поэтому довольно просто получить базовое приложение, работающее менее чем за 15 минут. Сплав вводит существенную перестановку папок: папка /app теперь находится там, где находится весь код разработки.

Папка /Ресурсы, где используется код, используемый для проживания, теперь является обновленным эквивалентом папки /build. Скомпилированный код в /Ресурсах перезаписывается в каждой сборке.

Я создал короткий вводный учебник (screencast) по созданию проекта "Сплав". Вы можете просмотреть его через мою папку с папками.

Создать проект сплава