Form生成ウィザード
Form生成ウィザードを利用して新たなFormを生成することができます。メニュー[File > New > Form]でForm生成ウィザードを開始します。
Formの生成が完了すると、該当編集ビューが自動的に開かれます。
ステップ1:Location
生成されるForm名とパスを入力する手順です。Formの「Name」と「Location」は必ず入力する必要のある項目です。Formファイルは、サービスで管理されているファイルであるため、サービス以外のパスに生成することができません。
Formテンプレートを登録した場合には、登録されたテンプレートの中で選択することができます。テンプレートはLayout、Positionが既に決まっている状態であるため、すぐに「Finishボタン」のクリックによってFormが生成されます。
ステップ2:Layout
Layout項目には、Formで使用するレイアウト情報を入力します。defaultレイアウトで指定された幅と高さの値は、Formプロパティに反映されます。
項目 | 説明 | |
---|---|---|
1 | Add Layout | レイアウトを追加します。 |
2 | Delete Layout | 選択されたレイアウトを削除します。 |
Layout情報の生成時に指定できるプロパティは以下の通りです。
Layoutプロパティ | 説明 |
---|---|
name | Layout名(一意識別子) |
screenid | Layoutで使用するScreenを設定します。 - ScreenDefinitionリスト中で複数選択することができます。 |
width | Layoutの幅を設定します。 |
height | Layoutの高さを設定します。 |
stepcount | Layoutの画面が分割される数を設定します。 |
stepindex | Formロード時に画面に表示する分割画面のインデックス値を設定します。 |
description | Layoutの追加説明を設定します。機能に影響を与えません。 |
mobileorientation | モバイル環境でのLayoutが表示されるデバイスの方向を設定します。 |
指定したパスに同じ名前のFormが存在している場合には生成することができません。
Formは、最低1つ以上のLayoutを持つ必要があり、default Layoutは必須項目として削除することができません。
ステップ3:Position
formでコンポーネント生成時に適用されるPositionプロパティ値の単位を設定します。デフォルト値はOptionで指定した値で表示されます。
各プロパティ値の単位を変更して、左下にある「Save position units in options」項目をチェックすると、指定された単位がOptionに保存されます。
その他のファイルの生成
File > Newメニューから追加で必要なスタイルファイル(CSS)、XMLファイル、スクリプトファイル、テーマファイルを作成することができます。
Themeファイル生成
新しいThemeファイルを生成します。 [File > New > Theme]で実行します。
Themeファイルの「Name」と「Location」は必ず入力する必要のある項目であり、生成されるパスに同じTheme名が存在している場合には、生成することができません。
Themeファイルの生成が完了すると、該当編集ビューが自動的に開かれ、ThemeファイルはResource ExplorerウィンドウのThemeに登録されて管理されます。
Themeファイルは、プロジェクトフォルダの下に指定した名前でフォルダが生成され、XCSSファイルとimagesフォルダ内の画像ファイルで構成されます。
[project] - [_resource_] -- [_theme_] --- [test] ---- theme.xcss ---- [images] ----- btn_CalDrop_D.png ----- btn_CalDrop_N.png ...
Style Sheetファイル生成
新しいStyle Sheetファイルを生成することができます。[File > New > Style Sheet]で実行します。生成可能なファイルの拡張子は「*.xcss」です。
XCSSファイルの「Name」と「Location」は必ず入力する必要が必須であり、生成されるパスに同じXCSS名が存在する場合には、生成することができません。「Insert Target」には、XCSSファイルを適用する場所を明示します。
Project ExplorerウィンドウにてInsert Targetに指定したApplicationの下のStylesの下位リスト、もしくはResource ExplorerウィンドウにてXCSSResourceの下位リストに登録されます。
編集ビューが開いているADLファイルとXCSSファイルを関連付けることができません。
Scriptファイル生成
新しいScriptファイルを生成することができます。[ File > New > Script ]で実行します。生成可能なファイルの拡張子は「*.xjs」です。
XJSファイルの「Name」と「Location」は必ず入力する必要のある必須項目であり、生成されるパスに同じXJS名が存在する場合には、生成することができません。
XJSファイルの生成が完了すると、該当編集ビューが自動的に開かれ、XJSファイルを生成した位置がサービスパスの場合、Project Explorerウィンドウのサービスに登録されて管理されます。
XMLファイル生成
新しいXMLファイルを生成することができます。[FILE > New > XML]で実行します。生成可能なファイルの拡張子は「*.xml」です。
XMLファイルの「Name」と「Location」は必ず入力する必要のある必須項目であり、生成されるパスに同じXML名が存在する場合には、生成することができません。
XJSファイルの生成が完了すると、該当編集ビューが自動的に開かれ、XMLファイルを生成した位置がサービスパスの場合、Project Explorerウィンドウのサービスに登録されて管理されます。
InitValueファイル作成
新しいInitValueファイルを作成することができます。[File > New > InitValueDefinition]で実行します。生成可能なファイルの拡張子は「*.xiv」です。作成されたInitValueファイルは、Resource Explorerに登録されます。
InitIalize項目はプロジェクトフォルダの下に_resource_/_initvalue_フォルダを作成し、該当フォルダ内に作成します。
InitValueDefinitionファイルの生成パスは変更できず、自動設定されたパスを使用します。
InitValueファイルが生成されたあと、InitValueを指定できる設定画面が表示されます。 InitValueを生成するオブジェクトまたはコンポーネントを選択してマウス右クリックして表示されるメニューから、[Add InitValueDefinition]項目を選択するか、ウィンドウの上部で[+]項目を選択します。
該当オブジェクトまたはコンポーネントの下にidが作成され、ウィンドウの右側のプロパティウィンドウがアクティブになります。生成されたidはアイテムをクリックすると、変更することができます。[Source]タブをクリックすると、作成、変更されたinitValueDefinitionファイルの内容を確認することができます。
UserFontファイル作成
新しいUserFontファイルを作成することができます。メニューの[File>New>UserFont]で実行します。生成可能なファイルの拡張子は「*.xfont」です。生成されたUserFontファイルは、Resource Explorerに登録されます。
UserFont項目は、プロジェクトフォルダの下に[_font_]フォルダを作成し、該当フォルダ内に作成します。
「Apply current file to Environment 'userfontid' property value」の項目をチェックすると、生成されたUserFontをEnvironmentのuserfontidプロパティ値として指定します。userfontidプロパティ値は、UserFontファイルの作成後に変更または削除することができます。
UserFontファイルは、サンプルコードが含まれた状態で生成されます。サンプルコードを希望する項目に変更して、コメントを削除すると、適用することができます。UserFontファイルに含まれたコードは、Generate時、HTMLファイルの<style>タグとして追加されます。
NREで実行する場合には、ユーザーのOSに該当するフォントが設定されている必要があります。
nexacro studioの使用時、OSにインストールされていないフォントをUserFontとして使用する場合には、プロパティウィンドウに該当フォントが表示されません。プロパティウィンドウから直接フォント名を入力する必要があります。
Googleフォントサービスのような外部サービスを利用する場合、以下のように該当するcss URLを指定してUserFontを定義することができます。
@import url(//fonts.googleapis.com/earlyaccess/hannari.css);
Formテンプレートの登録および利用
Formテンプレートとは、プロジェクト内で標準として使用したり、頻繁に使用する画面をパターン化したレイアウトを意味します。新しいフォームを作成する際にプロジェクト内で使用する標準レイアウトとして表示され、選択することができます。
Formテンプレートの登録
Formテンプレートは、下記の方法で登録することができます。
1
新しいフォームを作成します。
2
テンプレートとして作成する画面を構成し、必要な属性とスクリプトを追加します。
3
メニューの[File>Save As>Form Template]を選択します。
フォームのデザイン画面のコンテキストメニューまたはProject Explorerパネルで、該当のフォームを選択した状態で、コンテキストメニューの実行時に[Save as Form Template]を選択することもできます。
4
テンプレートの名前と説明を作成します。
保存パスの初期設定は下記のとおりです。[Tools > Options]メニュー>[Project > Easy UI > Form Template]より、プロジェクトで管理する保存パスを変更することができます。
C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\[Category Name]\[Template Name] C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\[Template Name]
フォームテンプレート登録時にカテゴリー項目を追加したり変更できます。カテゴリーが存在しない場合には、Form Templatesのデフォルトパス直下にフォームテンプレートが登録されます。フォームテンプレートの数が多い場合はカテゴリーによって管理することを推奨します。
カテゴリーを追加すると、ctgr0形式でカテゴリー名が追加されます。項目を選択した後、F2キーを入力すると、カテゴリー名を修正することができます。
5
[Create]ボタンをクリックすると、テンプレートファイルを作成し、結果を表示します。リンクをクリックすると、該当フォルダを表示します。
Formテンプレートを利用した新しいFormの作成
1
メニューの[File>New>Form]を選択します。
2
Form Wizard画面でTemplateを選択します。選択されたFormテンプレートのプレビュー機能を提供します。
3
Locationを選択して[Finish]ボタンをクリックすると、選択されたFormテンプレートで新しいFormが生成されます。
ViewSetテンプレートの登録および利用
本章もしくは節で説明する機能は、nexacro beyond 17.1.2.100バージョンで追加された機能です。
この機能はプレビュー機能です。
ViewSetテンプレートとは、Viewコンポーネントを用いた標準レイアウトを意味します。作成済のViewSetテンプレートは新しいフォームを作成する際にプロジェクト内で使用する標準レイアウトとして表示され、選択することができます。
ViewSetテンプレートの登録
Formテンプレートは下記の方法で登録できます。
1
新しいフォームを生成します。
2
ViewSetテンプレートで作る画面レイアウトを、Viewコンポーネントを利用して構成します。
Viewコンポーネントは、実際に動作するコンポーネントを配置するレイアウトを設定する役割をします。全体プロジェクト内でよく使用されるレイアウト形態を予め定義し、これをViewSetテンプレートで作成します。
ViewSetテンプレートの作成時にView オブジェクト内に他のコンポーネントを配置できますが、ViewSetテンプレートとして保存しながら、該当コンポーネントはテンプレートコードから削除します。Viewコンポーネント内で動作するコンポーネントは、Modelを基盤に自動生成します。
ViewコンポーネントはDivコンポーネントのようなContainerComponentの中に配置できません。Viewコンポーネントは、Formオブジェクトの子としてのみ登録できます。nexacro studio内でDivコンポーネント領域内にViewコンポーネントを持っておいたとしても、Divコンポーネントには含まれません。
3
メニューの「File > Save As > Form Template」項目を選択します。
Viewコンポーネントが含まれたFormを保存する場合は、ViewSet Template Wizardが実行され、Viewコンポーネントが含まれていない場合にはForm Template Wizardが実行されます。
4
Template NameとCategory項目を入力/選択して「Create」ボタンをクリックします。
Categoryは必要に応じて追加したり変更することができます。 Categoryを選択しない場合には、Viewset Templates項目の直下にViewSetテンプレートが格納されます。使用するViewSetテンプレートが多い場合にはCategoryを生成し、管理してください。
保存パスの初期設定は下記のとおりです。[Tools > Options]メニュー>[Project > Easy UI > Form Template]より、プロジェクトで管理する保存パスを変更することができます。設定したパスを基準に「viewset」フォルダが生成され、その配下にViewSetフォームテンプレートの保存パスが生成されます。
C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\viewset\[Category Name]\[Template Name] C:\Users\[User Name]\Documents\nexacro\17.1\templates\user\formTemplate\viewset\[Template Name]
ViewSetテンプレートを利用した新しいFormの作成
Viewset Templates項目は、プロジェクトの「Type Definition > Objects」リストにViewコンポーネントが追加された場合にのみ表示されます。
1
メニューの「File > New > Form」項目を選択します。
2
Form Wizard画面でViewset Templates項目の下でViewSetテンプレートを選択します。選択したViewSetテンプレートがどのような構成なのか予め確認することができます。
Categoryを指定した場合は、該当のCategoryフォルダの配下にViewSetテンプレートが追加されていることを確認することができます。
3
Nameを入力しLocationを選択した後「Finish」ボタンをクリックすると、選択したViewSetテンプレートで新しいFormが生成されます。