カスタムのアプリのテンプレートを作成する手順に、アプリのテンプレートの作成を参照してください。
インストールしたカスタムのアプリテンプレートのファイルとディレクトリは次のとおりです。
template.json # Template metadata such as title, category and description
template.xda # Project archive containing the template code
preview.png # (Optional) Preview PNG image.
preview/ # (Optional) Provides a live preview of template within architect
app/ # Any architect app with index.html can be used for preview
controller/
Tasks.js
model/
Tasks.js
store/
Tasks.js
view/
FormPanel.js
MainView.js
TaskList.js
index.html
app.jsデフォルトでは、カスタムのアプリテンプレートのファイルは Documents/Architect/Templates ディレクトリに格納されます。テンプレートはフォルダから動的に読み込まれるため、一連のテンプレートをソースコントロールを介して、あるいは単純なコピー/貼り付けで、簡単に共有できます。
この保存場所は、[Edit Menu（編集メニュー）] > [Preferences（基本設定）] > [File（ファイル）] > [Templates（テンプレート）] を開いて設定を変更することで、変えられます。この場所を変更すると、既存のテンプレートが自動的に移行されます。
テンプレートはできるだけシンプルにすることが重要です。現在のプロジェクトやプロジェクトのアーカイブ（.xda）ファイルを使用してテンプレートを作成すると、ビルドファイル、ユーザー設定、SDK ファイルといった不要なアイテムが自動的に削除されます。
テンプレートのプレビュー画像
テンプレートに「preview.png」ファイルを含めると、Architects テンプレートブラウザで表示できる視覚的なプレビューをユーザーに提供できます。プレビュー画像の推奨サイズ（ピクセル）は次のとおりです。
- デスクトップまたはタブレットをターゲットとするテンプレート:*800x600*
- スマホをターゲットとするテンプレート:*325x525*
テンプレートのプレビュー
テンプレートにリアルタイムのプレビューを含めることもできます。現在のプロジェクトやプロジェクトのアーカイブ（.xda）ファイルを使用してテンプレートを作成する際、プレビューフォルダが自動作成されますが、プレビューファイルはいつでも編集できます。
プレビューフォルダが正常に機能するには、フォルダに「index.html」ファイルが必要です。
テンプレートのメタデータ
テンプレートのメタデータは次のように template.json に格納されます。
{
"title": "Button Template",
"name": "ButtonProject",
"description": "A template with a big button.",
"category": "My Templates",
"framework": "ext42"
}そこに、次のテンプレート値が保存されます。
| プロパティ | タイプ | 必須 | デフォルト値 | 説明 |
|---|---|---|---|---|
| name | string | true | -- | テンプレートのプロジェクト名です。（編集しないでください） |
| framework | string | true | -- | テンプレートのフレームワークです。たとえば、「ext42」などです。（編集しないでください） |
| title | string | true | -- | テンプレートブラウザで使用される表示タイトルです。 |
| category | string | true | -- | テンプレートが表示されるテンプレートブラウザ内のカテゴリです。 |
| description | string | false | -- | テンプレートの詳細な説明です。 |
| usePreviewImage | boolean | false | false | 動的なテンプレートではなくプレビュー画像をテンプレートで強制的に使用します。 |
| profile | string | false | -- | テンプレートブラウザにおけるテンプレートの表示とプレビューの方法を決定します。ExtJS には「desktop」を、Sencha Touch には「phone」を自動的に使用します。「tablet」という値を指定して、タブレット様の表示を行うこともできます。 |
高度なテンプレートの編集
テンプレートを作成またはインポート後に編集するには、ローカルのテンプレートフォルダで直接編集します。*template.json* メタデータファイル、プレビュー画像、リアルタイムプレビューファイルを直接編集できます。ただし、実際のテンプレートのコードはプロジェクトのアーカイブ（template.xda）として内部的に保存されているため、Architect を使用して次の方法で編集することが必要です。
- テンプレートフォルダで template.xda ファイルを探します。
- [File（ファイル）] > [Import Archive（アーカイブをインポート）] を選択します。
- 必要に応じてプロジェクトを編集し、一時的な保存場所に保存します。
- 完了したら、[File（ファイル）] > [Archive Project（プロジェクトをアーカイブ）] を選択します。
- 新しいプロジェクトアーカイブを「template.xda」としてテンプレートフォルダに上書き保存します。
- テンプレートメタデータの framework と category の値がアーカイブしたプロジェクトのそれを同じであることを確認してください。
テンプレートのバージョン管理とアップグレード
テンプレートは特定バージョンの ExtJS や Touch に固有のものです。 template.json の framework の値は template.xda もアップグレードする場合を除き、変更してはなりません。テンプレートをアップグレードする場合、そのテンプレートを使用して新しいプロジェクトを作成し、そのプロジェクトを対象のフレームワークにアップグレードし、これを使用して新しいテンプレートを作成するのが最適な方法です。プロジェクトライブラリのバージョンアップに関する詳細は、「リソースの使用」の「ライブラリのアップグレード」を参照してください。