44

最近、Appcelerator の Titanium を使用して iPhone アプリケーションの作成を開始しました。アプリケーションは基本的にすべて JS であるため、このプロジェクトをどのように編成するべきかについてアドバイスが必要でした。

アプリケーションのビューごとに長い手続き型ファイルを作成することが非常に簡単になりつつあります。プロジェクトに MVC や何らかの構造を組み込む方法はありますか?

ありがとうございます。-ティロ

4

5 に答える 5

31

app.js ファイルがメイン コントローラーであり、作成する各ビューがビューであり、ビューに対してモデル データを渡す (または設定する) ことを考えると、Titanium 自体は本質的に MVC です。

Titanium では、いくつかの優れた組み込みメカニズムを使用して、アプリケーションを分解できます。

  1. Titanium.include#include - Titanium.include を使用すると、Cコンパイラ ディレクティブと同様に、1 つまたは複数の JS ファイルを配置できます。このファイルに共通の関数と JS クラスを配置し、それらをインポートして使用できるようにしたい場所に含めることができます。

  2. Titanium.UI.createWindow - 新しいウィンドウのプロパティとして新しいビューを作成し、URL を別の JS コンテキストに渡すことができます。これにより、新しい JS サブコンテキストが作成され、独自の変数スペースを維持できます (ただし、あなたはあなたの親に戻ってアクセスします）。

また、Titanium では、自分と自分のアプリケーションに適した方法でアプリケーションを論理的に編成できるフォルダーを作成できます。

編集:今日、Titanium.Include メソッドは廃止されました。ドキュメントに記載されているように、CommonJS モジュールを作成し、require()ステートメントを使用する必要があります。

このステートメントの詳細:必須

モジュールに関する詳細情報:モジュール

于 2010-04-07T16:38:18.057 に答える
24

Titanium モバイル プロジェクトに適した MVC ソリューションが見つからなかったので、次のアプローチを思い付きました。小さなアプリの場合、これは過剰に設計されている可能性がありますが、成長するアプリケーションを維持するのに役立ちます。

フォルダ構造:

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

ビュー、モデル、コントローラーを分離するには名前空間が必要なので、メイン コントローラーである app.js で定義します。

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

フォルダー内には、コンポーネントごとに 1 つの JavaScript ファイルを配置します。これには、MooTools や Prototype などの軽量の JavaScript OOP ライブラリを使用するか、単純な 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"
   }
}

その後、必要なすべてのモデル/ビュー/コントローラー クラスを Ti.include() で app.js ファイルに含め、名前空間でコンポーネントを参照できます。

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

MVC アプローチでは、コントローラーがビューの状態を「制御」し、モデルからビューにデータを渡すと仮定します。ビューは、スタイリング用の UI 要素とプロパティのみで構成されます。UI で行われるすべてのアクションは、目的のアクションを実行するようにコントローラーに指示するイベントを発生させます。

しかしもちろん、MVC の正確な定義は、個人の好みによって異なる場合があります ;)

于 2011-05-02T11:43:46.773 に答える
6

これも役立つ場合があります: Titanium モバイル プロジェクトを編成する方法の基本構造: https://github.com/krawaller/Struct

于 2011-05-02T10:31:24.233 に答える
3

ほとんどの回答が置き換えられているため、この質問を更新させてください。2012 年第 4 四半期、Appcelerator は、最新の IDE および SDK リリースである Titanium Studio 3.0 および SDK 3.0 とともに、Alloy MVC (ベータ) フレームワークをリリースしました。Alloy は Studio と完全に統合されているため、基本的なアプリを 15 分以内で簡単に実行できます。Alloy では、大幅なフォルダーの再構築が導入されています。/appフォルダーは、すべての開発コードが存在する場所になりました。

コードが常駐していた/Resourcesフォルダーは、更新された/buildフォルダーに相当します。/Resourcesのコンパイル済みコードは、ビルドごとに上書きされます。

Alloy プロジェクトの作成に関する短い入門書 (スクリーンキャスト) を作成しました。マイ ドロップボックス フォルダから表示できます。

合金プロジェクトの作成

于 2013-02-25T04:58:23.997 に答える
0

Appcelerator はマーケットプレイスで独自のAppcelerator MVCを作成したようですが、まだ評価していません。

詳細: http://johnkalberer.com/2011/09/29/appcelerator-mvc-example/

于 2012-04-10T19:41:13.427 に答える